css - 内容 div 未填充页面，页脚未对齐

Question

我有一个带有固定高度页眉的页面，内容（中间部分）应该填充大部分屏幕直到页脚，以及一个固定高度的页脚应该贴在页面底部：

http://jsfiddle.net/PyQed/

我在这里遇到的问题是：

1. 内容 div ( #content-wrapper) 没有填满页面，即使我也设置了min-height: 100%;and height: 100%;, for htmlandbody标记。

2. 页脚在底部有一个间隙，而不是粘在页面的最底部。显然，该body元素并没有延伸到页面的整个高度，尽管如此html。

我遵循了this page关于如何让页脚粘在页面底部的建议，但它似乎不适用于我的特定设置。

Answer 1

像这样的东西会做它演示http://jsfiddle.net/KFur6/517/

html, body {
    height: 100%;
}
#divHeader {
    width: 100%;
    height: 150px;
    background:blue;
}
#divContent {
    min-height: 100%;
    height: auto !important;
    /*Cause footer to stick to bottom in IE 6*/
    height: 100%;
    margin: 0 auto -30px;
    /*Allow for footer height*/
    vertical-align:bottom;
    background:yellow;
}

#divPush {
    height: 30px;
}
#divFooter {
    width: 100%;
    height: 30px;
    /*Push must be same height as Footer */
    bottom:0;
    background:blue;
}