当我向嵌套DIV添加边距时,它会导致父DIV接收边距,除非我给父DIV一个边框。为什么?

我通常通过设置 display: inline-block 在outer div上。它将使outer div完全占据显示其内容所需的空间。

An example ,显示差异。

这就是所谓的边际崩溃。当上下边距直接接触(不被任何东西分开,如边框或换行符)时,边距将塌陷为单个边距。这不是虫子。点击此处了解更多信息 SitePoint

听起来像是自然的边缘塌陷。这是一本很好的读物:

http://www.andybudd.com/archives/2003/11/no_margin_for_error/

有很多方法可以解决利润率崩溃的问题。一种方法是添加边框 更长时间的崩溃。

另一种阻止页边距折叠的方法是更改 CSS2规范解释了绝对和相对位置框的边距 不要崩溃。另外,如果浮动一个框,它的边距将不再折叠。并不总是这样 你遇到了不需要的利润率崩溃的问题,这可能是一个选择。