Firefox 错误地将 margin-bottom 添加到元素的顶部答案

【问题标题】：Firefox incorrectly adding margin-bottom to the top of an elementFirefox 错误地将 margin-bottom 添加到元素的顶部
【发布时间】：2013-04-18 04:05:18
【问题描述】：

在 Firefox 中，当我添加以下 CSS 规则时，75px 边距底部也适用于 #header-container 的顶部。 Firebug 没有报告这一点，但该元素已在页面下移了确切的边距底部量。其他浏览器不这样做。

有人知道为什么会发生这种情况以及如何阻止它吗？谢谢。

#header-container{
    position: relative;
    margin: 0 auto 75px;
    width: 960px;
}

【问题讨论】：

无法重新创建http://jsfiddle.net/7dbpE/
从来不知道边距：0 auto 75px;工作。您是否尝试过个人保证金规则？像 margin-top: 0;右边距/左边距：自动；边距底部：75px;
你在使用重置样式表吗？
听起来可能是margin collapse。没有演示，我们只能猜测。
@Morpheus - 我也无法仅使用上面的 CSS 重新创建，这表明它是导致问题的其他原因。有点极端，但这里是您对来自引起问题的页面的 HTML 输出以及完整的 CSS 的摆弄。如果你能看一下，我会很高兴的。谢谢。 http://jsfiddle.net/7dbpE/4/

标签： html css firefox margin

【解决方案1】：

我不知道这是怎么发生的，为什么会这样，但是如果你把你的 #header-container 样式改成这个

#header-container{
   position: relative;
   margin-bottom: 75px;
   width: 960px;
   float: left;
}

它会解决问题。

【讨论】：