spec表示：
流入块级元素的下边距总是与其下一个流内块级兄弟的上边缘坍塌，除非兄弟姐妹有间隙。
但是我发现了一些意外的事情。code如下。
<div style="margin-bottom: 100px; "></div>
<div style="float:left;width:10px;height: 10px; background: red"></div>
<div style="margin: 100px;clear: left"></div>
test
第一个div的下边距和第三个div崩溃的边距，这违反了'除非兄弟姐妹有清除'。
如何解释这种情况？你能给我一些具体的例子来更准确地解释上面的规则吗？
答案 0 :(得分：1)
问题前提是不正确的。对于所有情况栏1，边距不会崩溃。
最简单的情况是Chrome，在给定的示例中，第三个元素 有间隙，第一个div的下边距不会与第三个div的边距一起崩溃，并且计算出的间隙是-90px。所以第三个盒子的顶部是容器顶部的100px + 100px - 90px = 110px。
此计算在{2.2}规范中的clear属性的示例2中进行了描述。
同样，在Firefox或Edge中，如果示例前面有一些内容，或者即使主体只有顶部边框，那么边距也不会崩溃，间隙为-90px;
当没有前面的内容或顶部边框到主体时，特殊情况在Firefox和Edge中。在这种情况下，Edge不会折叠边距并将间隙计算为0. Firefox确实会缩小边距。