html - 尽管身高 100%，页脚仍停留在页面中间

Question

现场直播

尽管设置了 body ，但我的页脚在某些页面（关于，联系）的中间页面卡住了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

为您的容器添加 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>