html - 尽管 body 高度为 100%，页脚仍然卡在中间页面

Question

live site

尽管设置了正文 height:100%，但我的页脚仍卡在某些页面(关于、联系方式)的中间页面。我指定了页脚高度，并尝试了 position:fixed、position:absolute 和 bottom:0。似乎没有任何帮助，有什么想法吗？

编辑:尝试“粘性页脚”也不起作用；它将页脚稍微放在中心页面的右侧。

body {
    background: #fff;;
    font-family: london, Arial, sans-serif;
    height: 100%;
}

#container {
    width: 960px;
    margin: 0 auto;
    padding: 60px 0 120px 60px;
}
#footer {
    position: absolute;
    width: 340px;
    margin: 0 auto;
    bottom: 0;
    height: 120px;
}

Answer 1

为您的容器、 fiddle 和下面的代码添加 100% 的高度

http://jsfiddle.net/pJAsF/2/

html, body {
    background-color:#f5f5f5;
    height:100%;
}
#header {
    position:relative;
    background:#333;
    min-height:50px;
}
#container {
    width: 960px;
    margin: 0 auto;
    height:100%;
}
#container p {
    font:2em normal Futura, sans-serif;
}
#footer {
    background-color:#333;
    min-height:50px;
}

<div id="header"></div>
<div id="container">
    <p>Hello</p>
</div>
<div id="footer"></div>