除非我添加边框，否则div divins内部不是容器div背景的一部分

Question

这不是一个生产问题，这只是我遇到的事情并且一直在想。内部div的边距不会获得父div的背景颜色，除非我向父div添加边框。因此，除非我向标题div添加边框，否则innerDiv的边距将不会获得标题div的背景。

<div id="container">
   <div id="header">
     <div id="innerDiv">Title</div> 
   </div>
   <div id="content" >

     <button>Remove Border</button>
   </div>

   <div id="footer" >
     footer
   </div>

</div>

这个小提琴希望能够证明我的问题。 http://jsfiddle.net/eTq2P/6/

所以我不是在找工作，我想知道为什么边距不会得到父div的背景颜色，除非将边框添加到父div。我期待保证金包含在父div中。

Answer 1

添加边界力#header以包含#innerDiv，因此如果#innerDiv将其拉伸到大小。您可以通过添加

来完成相同的无边框操作

#header {overflow: auto;}

另请参阅：CSS: Adding a border changes the background-color (?!)

Answer 2

* {box-sizing：border-box;}有很多帮助。