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

Question

让页脚停留在页面底部有很大的问题。

我决定将代码添加到 pastebin:

这是 css:http://pastebin.com/uf2c7jLX

这是其中一页:http://pastebin.com/qpwz22us

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

比如有时候会出现这种情况，一些内容被页脚隐藏了:

浏览器 View 底部和页脚之间存在巨大差距。上图还显示页脚与内容重叠。

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

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%;

}

这是 fiddle http://jsfiddle.net/vFg8j/

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