Html 为什么水平边距不'；垂直边缘是否会塌陷？

我理解利润率崩溃的原因；我在不同的网站上看到了一些关于它如何发生以及为什么发生的例子

具体来说，下面是我读到的帖子的链接：

它清楚地解释了崩溃是垂直发生的，它是这样实现的。但是，有人提到

这种情况不会发生在水平边距（左侧和右侧），而只发生在垂直边距（顶部和底部）

没有解释为什么它不会发生在水平边缘

为什么水平边距没有塌陷呢？

这是问题所在。块框在静态放置时，往往会占据其包含块内可用的水平空间。

---

如果设置框的宽度，它将添加一个右边距进行补偿。

水平边距永远不会有机会折叠，因为控制边距折叠的规则意味着它们永远无法满足条件

在CSS中，两个或多个框（可能是同级框，也可能不是同级框）的相邻边距可以合并形成一个边距。以这种方式合并的保证金称为崩溃保证金，由此产生的合并保证金称为崩溃保证金

折叠式页边距（）

相邻框只能是块级框：

两个边距相邻当且仅当：

• 两者都属于参与相同块格式上下文的流内块级别框

折叠式页边距（）

而利润只有在没有绝对浮动或定位的情况下才会崩溃：

• 浮动框和任何其他框之间的边距不会塌陷（甚至浮动框与其流入子项之间也不会塌陷）
• 建立新块格式上下文的元素（例如浮动和具有“溢出”而非“可见”的元素）的边距不会与其在流中的子元素一起塌陷
• 绝对定位框的边距不会塌陷（即使有其流入子项也不会塌陷）

折叠式页边距（）

这意味着块级别框永远不能水平放置在同一行上（因为默认情况下，块级别框将自动从新行开始）并同时满足边距折叠条件

理论上，内联框可以满足这些条件，但由于它们不是块级别的，所以规则根本不适用于它们

在内联格式上下文中，框从包含块的顶部开始，一个接一个地水平排列。在这些框之间考虑水平边距、边框和填充

内联格式上下文（）

也就是说，它们没有崩溃的简单原因是W3C这么说的：

水平边距永远不会塌陷

---

折叠边距（）

当您添加任何dom元素时，边距是从左到右添加的，一个挨着一个，这意味着主布局是水平的，这就是为什么我认为折叠只发生在垂直方向上。 这样可以确保每次元素在垂直面几乎彼此接触时都有一条“新线”，您可以更改主元素布局，例如在angularjs中，从：

<div layout="row"></div>

到

这会将布局更改为垂直布局，因此您添加的每个元素都将从上到下进行处理，边距也是如此。如果您将

边距设置为：-20px

我的猜测（这纯粹是猜测），这将使元素从下到上依次排列HTML/CSS最初只是用于显示文本/一般信息，可能从来没有考虑过它会变成今天高度基于图形设计的系统。因此，如果在

之后有

，那么合并上下边距以节省空间是有意义的

<div layout="column"></div>