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

【问题标题】：Why margin collapsing is not happening in this case?为什么在这种情况下没有发生保证金崩溃？
【发布时间】：2012-11-24 19:51:14
【问题描述】：

为什么在this 的情况下没有发生边距折叠？

<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。为什么？

【问题讨论】：

标签： css margin

【解决方案1】：

引用the doc:

水平边距永远不会塌陷。

【讨论】：

...除非您使用的是旧版本的 IE，但 IE 违反规则这一事实并不令人意外。

【解决方案2】：

您总是可以将样式放在 HTML 中以确保安全工作..？是否也使用 Reset CSS？

【讨论】：

【解决方案3】：

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

【讨论】：