webapp如果把页面div宽度设成100%,外边距设成5px,右边无法显示效果?


我把整个ul的外边距设成4px,但只有右边的没反应。
在开发webapp时总遇到这种情况,距离只要和右边沾边就无法表现出来
图片描述

css3 webapp web前端开发 html5

jiairu 10 years, 2 months ago

可以用楼上两位的 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

大葱小黄瓜君 answered 10 years, 2 months ago

ul{box-sizing:border-box}

潛水艦U511 answered 10 years, 2 months ago


 *{
   box-sizing: border-box;
}

Taku桑 answered 10 years, 2 months ago

之前第一次做APP页面也遇到过,如楼上所说,去掉100%,直接设置margin就可以了。
另外在我印象里,border-box属性只对内边距padding和边框border起作用吧。

秀吉我的菜 answered 10 years, 2 months ago

border-box是控制不了margin的,所以你还是老实的不给div设置宽度100%,然后设置margin就OK了。

konoka answered 10 years, 2 months ago

你100%+外边距5px*2>100%了。当然会无法显示,要么加个box-sizing:border-box,要么就在内部套一个层,去除外层的外边距,在内层定义padding左右5px更佳。

萌里花落知多少 answered 10 years, 2 months ago

Your Answer