如何让这个粘性页脚工作？

Question

我已经在我的网站上应用了从here获得的CSS粘性页脚教程，但出于某种原因我无法使其工作？

JSBin

提前致谢。

Answer 1

从#body中删除上边距并用padding替换它：

#body {
    width: 1200px;
    margin: 0 auto;
    overflow:auto;
    padding-top: 80px;
    padding-bottom: 170px;
}

为html（不仅是正文）添加100％的高度：

html, body {
  background-color: #FFF;
  margin: 0;
  padding: 0;
  height: 100%;
}

Full JSBin solution和preview

Answer 2

您是否在HTML代码中应用了正确的#footer ID？

<div id="footer">

</div>

Answer 3

我无法立即看到你的代码有什么问题（这是很多css，你使用像中心这样的奇怪标签）。我发誓这个版本的粘性页脚：http://ryanfait.com/sticky-footer/

对我来说很好，并且非常传统/跨浏览器兼容。也许这是你的选择...