Question

目前我正在使用Concrete5建立一个网站，位于：http://tinyurl.com/cee5rvo

Firefox在某些页面（例如图库）上按下标题（导航和h1标记），我不明白为什么。

Chrome和IE10都能正确显示。

感谢您的帮助。

Answer 1

div上有10px的余量#asmillerGalleryBlock ...设置为margin：0 auto;

Answer 2

由于浮动问题，您的元素没有正确占用空间。将此添加到您的CSS： #content {float：left}

Answer 3

我认为你的问题与你如何漂浮元素有关。

如果您在导航中检查nav-selected nav-path-selected，您会看到它的计算高度为0px。

这是一个非常常见的问题，因为浮动元素不会强制其父容器自动调整大小。当一个元素浮动时，它的父元素不再包含它，因为浮动元素从流中移除。由于浏览器以不同的方式处理此问题，因此常见的解决方案是使用“clearfix”。

如果您将以下内容添加到全局CSS ...

.clearfix:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}

.clearfix {
    display: inline-block;
}



html[xmlns] .clearfix {
    display: block;
}

* html .clearfix {
    height: 1%;
}

将clearfix添加到0px高度的元素（例如导航选中），您将看到该元素继承了正确的高度。

Answer 4

处理此问题的最佳方法是在#content div中添加一行。

#content {
    overflow: hidden;
    width: 800px;
}

隐藏的溢出将清除浮动并停止推送内容的不良影响。

Firefox错误地渲染CSS（间距因人而异）

4 个答案: