css - 在 Chrome 中将页脚固定在底部不起作用（在 IE、Firefox、Safari 中有效）

Question

在http://ryanspahn.com/adsgrader2/index你可以看到我有一个灰色的页脚，在 IE、Safari 和 Firefox 中，页脚粘在底部。但在 Chrome 中，它并没有坚持到底——这很奇怪。

我使用堆栈中的以下方法创建了这个粘性页脚...... CSS 使 HTML 页面页脚以最小高度保持在页面底部。

我想知道是否有人以前见过这个，或者有解决这个 Chrome 问题的建议。

Answer 1

我不确定那个教程，但如果你想让你的页脚保持在底部，你需要使用固定定位而不是相对。固定意味着当页面的其余部分滚动时它不会滚动。您可以使用相同的属性在绝对定位中锚定它top, bottom, left, right。

将以下内容添加到您现有的 css 中，并在必要时更改值。

#footer {
     position: fixed;
     bottom: 0px;
     width: 100%;
}

#foot {
    margin: 0px auto;
}

我还注意到，当您这样做时，您必须将您在页脚左侧的图像浮动。

#right img {
    float: left;
}