css - 为什么在这种情况下没有发生保证金崩溃？

Question

为什么在这种情况下没有发生保证金崩溃？

<p> First </p>
<p id="second"> Second </p>

p {
    background-color:red;
    margin-top:10px;
    display:inline;
    margin-right:10px;
}
#second {
    margin-left:10px;
}

这两者之间的边距最终为 20px，而不是 10px。为什么？​</p>

Answer 1

引用文档：

水平边距永远不会塌陷。

Answer 2

您总是可以将样式放在 HTML 中以确保安全工作..？还使用重置 CSS 吗？

Answer 3

边距折叠仅发生在 2 个垂直块元素之间。
你有水平元素，这两个都是内联元素。
因此，保证金崩溃不会发生。