html - Chrome/Safari 和 Firefox 之间奇怪的边距差异

Question

我最近设计了一个网站(http://willryan.us/typefun01)，主要是用Chrome边编码边测试。我最近注意到在某些部分的末尾发生了一些奇怪的事情(历史之后的空白，样式与解剖学的重叠)。

我的样式表中有一个 css 重置(不确定这是否与此有关)，我不知道是什么原因造成的，也不知道如何让网站看起来像在 Chrome

Answer 1

历史之后的差距是由于:

#historyWide {
    margin: 250px 80px 75px;
}

可以通过以下方式补救:

div#content > div {
    overflow: hidden; /* or auto */
}

您还可以将#content 的子 div 内元素的较大顶部和底部边距移动到子 div 本身的填充。只要所有内容都包含在这些子 div 中，任何内容都可以正常工作。

您只是看到了浏览器处理不完美布局的不同方式。