Question

我们有一个粘性页脚，它在基于WebKit的任何内容中运行良好，但似乎不适用于Firefox（或IE的新版本）。

在页脚下方生成额外的空间，高度约为200px，继承了正文的背景颜色。

额外空间似乎不是我们可以找到的任何div的一部分，包括html，正文，内容，包装等等。它似乎也不是由任何元素上的任何填充或边距引起的

我们在Ryan Fait's CSS Sticky Footer方法上构建了它，它使用包装div内部的push div，并带有一个单独的页脚div。

您可以在redesign.treepuncher.com/freetrial/

查看

Answer 1

页面底部的iframe和版权会造成不必要的空间。如果不影响您网站的功能，您可以停止显示iframe。试试这段代码：

.copy {
    color: #FFFFFF;
    float: right;
    font-weight: 100 !important;
    margin: 95px 15px 0 15px; //Fixes margin at the bottom of this div
}

iframe {
    display: none; //Stops iframe from being displayed
}

Answer 2

以下css应该使其粘滞并删除底部不必要的空间

.footer {
    background-color: #006837;
    bottom: 0;
    color: #FFFFFF;
    font-family: "roboto",sans-serif;
    font-size: 12px;
    font-weight: 100;
    height: 120px;
    position: fixed;
    width: 100%;
}
.wrapper {
    height: auto !important;
    margin: 0 auto;
    min-height: 100%;
}

粘滞页脚不适用于Firefox

2 个答案: