html - 无法让页脚停留在页面底部

Question

在让页脚停留在页面底部时遇到很大问题。

我决定将代码添加到 pastebin：

这是CSS： http: //pastebin.com/uf2c7jLX

这是页面之一：http: //pastebin.com/qpwz22us

这个问题在整个网站上都是一致的。我究竟做错了什么？

例如，有时会发生这种情况，一些内容被页脚隐藏：

浏览器视图的底部和页脚之间有一个巨大的差距。上图还显示页脚与内容重叠。

关于编辑：第二个也不是我想要的。页脚和浏览器底部之间有一个巨大的差距。我希望页脚位于底部，如果内容太长以至于您必须滚动，那么在您到达页面底部之前，页脚应该不可见。谢谢 ：）

Answer 1

编辑：其实我刚刚看到你的截图，只是将绝对定位改为相对

更改页脚和正文的位置并从页脚中删除边距：

body{
margin: 0;
padding: 0;
/*padding-bottom: 60px;*/
width: 100%;
height: 100%;
position: relative;
}

footer{
position: relative;
background: cornflowerblue;
height: 60px;
width: 100%;

}

这是小提琴http://jsfiddle.net/vFg8j/

另一个有用的资源 - 粘性页脚http://ryanfait.com/sticky-footer/