html - CSS DIV 宽度 100% 超过 div

Question

我有一个宽度为 512px 的 DIV。然后在那个 DIV 里面是另一个 DIV。我将 THAT DIV 的宽度设置为 100%。然而，它过去了，这不是我想要的。

我正在努力让它留在 div 中。就像所有边上的 5px 填充一样。

http://jsfiddle.net/weka/USvTC/

Answer 1

发生此问题是因为 padding 和 border 不是 width: 100% 的一部分。

假设你确实想要绝对定位#exp_wrap，使用这个:http://jsfiddle.net/thirtydot/USvTC/1/

我删除了 .bar_wrap/#exp_wrap 上的 width: 100%，并添加了 right:5px;在 #exp_wrap 上。

div 等 block 元素默认为 width: auto，并占用全部可用的水平空间。这类似于 width: 100% 的工作方式，除了 padding 和 border 被计算在 inside 宽度:自动。

如果#exp_wrap不需要绝对定位，使用:http://jsfiddle.net/thirtydot/USvTC/2/

我再次删除了 .bar_wrap/#exp_wrap 上的 width: 100%，并替换了 position:absolute;顶部:5px； left:5px; 和 margin: 5px;。我还在 .container 中添加了 overflow: hidden 以避免折叠边距。