DIV+CSS教程
CSS设置width100%与padding后宽度溢出超出父节点解决方法
在CSS中如果设置 width:100%,同时设置了padding后,宽度会超出父节点。等于实际宽度=100%+padding的宽度,这对我们的布局需求造成一定的困扰。
但使用CSS3中的box-sizing属性即可解决这个问题
比如:
.box {width: 100px; height: 100px; background: red;} .boxx {width: 100%; padding: 10px; background: black;} <div class="box"><div class="boxx"></div> </div>
那么boxx的实际宽度会超出box的宽度,
这时,只需给box添加 box-sizing:border-box; 属性即可解决
-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
请站长喝杯咖啡?
站长一直坚持白天工作、晚上熬夜更新素材,付出了巨大的精力和时间,其中的辛酸难以言述。
坚持免积分、免登录、无任何限制下载!如果本站素材对你有用,不妨考虑请站长喝杯咖啡鼓励一下!
标签:CSS宽度
你应该也喜欢这些吧
共有 0 条评论