为啥相邻部分的边距没有塌陷？ [关闭]

Posted 2023-03-24

【中文标题】为啥相邻部分的边距没有塌陷？ [关闭]

【英文标题】：Why are the margins of adjoining sections not collapsing? [closed]为什么相邻部分的边距没有塌陷？ [关闭]

【发布时间】：2014-03-21 13:10:12

【问题描述】：

我有几个部分，每个部分都带有margin: 10px;，但垂直边距似乎加倍为 20px，而不是像应有的那样折叠为 10px。知道为什么会发生这种情况吗？

【问题讨论】：

你做了什么让他们崩溃？你能分享你的 html 吗？

@Yoshi 这正是我所说的垂直边距。顶部/底部边距没有折叠。

@dystroy — 让边距折叠的常用方法是在元素上放置下边距，在其后的元素上放置上边距。

@dystroy 我没有做任何事情让它们崩溃。垂直（或顶部/底部）边距通常应该折叠。

没有任何来源，就不可能知道到底发生了什么。请制作小提琴以帮助我们帮助您。

【参考方案1】：

（较大）子元素的边距可能会在其容器中塌陷，并将其他元素推得更远 浮动元素的边距不会折叠 绝对定位元素的边距不会折叠

【讨论】：

问题是你的第一点。子元素的较大边距正在通过。

【参考方案2】：

我建议阅读the specification。我的猜测是你要么有一个边框，要么有一些填充物可以防止崩溃。