扫码关注官方订阅号
我把整个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起作用吧。
微信扫码关注PHP中文网服务号
QQ扫码加入技术交流群
扫描下载App
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
PHP学习
技术支持
返回顶部
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起作用吧。