我把整个ul的外边距设成4px，但只有右边的没反应。 在开发webapp时总遇到这种情况，距离只要和右边沾边就无法表现出来
认证0级讲师
*{ box-sizing: border-box; }
ul{box-sizing:border-box}
可以用楼上两位的box-sizing: border-box 还可以用{width: -moz-calc(100% - 8px); width: -webkit-calc(100% - 8px); width: calc(100% - 8px); margin: 0 4px;}
box-sizing: border-box
{width: -moz-calc(100% - 8px); width: -webkit-calc(100% - 8px); width: calc(100% - 8px); margin: 0 4px;}
https://developer.mozilla.org/zh-CN/docs/Web/CSS/calc
你100%+外边距5px*2>100%了。当然会无法显示，要么加个box-sizing:border-box，要么就在内部套一个层，去除外层的外边距，在内层定义padding左右5px更佳。
border-box是控制不了margin的，所以你还是老实的不给p设置宽度100%，然后设置margin就OK了。
之前第一次做APP页面也遇到过，如楼上所说，去掉100%，直接设置margin就可以了。 另外在我印象里，border-box属性只对内边距padding和边框border起作用吧。
![[웹 프런트엔드] Node.js 빠른 시작](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
ul{box-sizing:border-box}
可以用楼上两位的
box-sizing: border-box还可以用
{width: -moz-calc(100% - 8px); width: -webkit-calc(100% - 8px); width: calc(100% - 8px); margin: 0 4px;}https://developer.mozilla.org/zh-CN/docs/Web/CSS/calc
你100%+外边距5px*2>100%了。当然会无法显示，要么加个box-sizing:border-box，要么就在内部套一个层，去除外层的外边距，在内层定义padding左右5px更佳。
border-box是控制不了margin的，所以你还是老实的不给p设置宽度100%，然后设置margin就OK了。
之前第一次做APP页面也遇到过，如楼上所说，去掉100%，直接设置margin就可以了。
另外在我印象里，border-box属性只对内边距padding和边框border起作用吧。