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

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

尽管身高100％，页脚卡在中间页面

1 个答案: