孩子在襯墊100％的寬度應用於父

width:200px; 
padding:5px 
border:1px solid

和另一div，因爲它是孩子這個CSS：

width:100% 
border:1px solid

和這些div已呈現在FF和IE這樣的：
enter image description here

但它似乎正確的填充小於l一個！任何人都可以告訴我爲什麼會導致這種行爲？
謝謝

發生這種情況是因爲內部div的邊界不是width本身的定義的一部分，所以您的內部div實際上是100% + 2px寬。

應指定box-sizing: border-box;的內格，因此它的寬度將包括邊界

見MDN documentation有關此屬性的更多信息（和瀏覽器支持）。

2013-08-28 13:33:50 fcalderan

還要確保你使用'-moz'和'-webkit'來代替'box-sizing'。 –

WOW！像魅力一樣工作，感謝不盡相同 –

什麼是像你的父元素溢出？除非我誤將寬度設置爲帶有邊框的100％，因此在200px的div內寬度爲200px，因此不會顯示邊框。

我的快速解決方案（肯定有更好的方法）將使填充在右邊2px以上或比整體填充少2px。

2013-08-28 13:32:02

我用'溢出：隱藏'的父母，但沒有運氣！ –

它將邊界推向右邊。將box-sizing: border-box設置爲內部div。

-webkit-box-sizing: border-box; 
-moz-box-sizing: border-box; 
box-sizing: border-box;

2013-08-28 13:34:09 Razz

您應該再次檢查箱型號。

您正在使用寬度爲100％的div並向其添加邊框1px，因此div會變爲100％+ 2px寬度，並且會像您看到的那樣向右推。

您應該放下「寬度：100％」並添加邊框。（因爲div是一個塊元素，它將佔用整個寬度）

即使IE7不支持它，您也不需要添加框大小。（如果你想IE7的支持）

2013-08-28 13:34:59 drip

回答