Question

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

我遇到的问题是：

内容div（#content-wrapper）未填充页面，即使我为min-height: 100%;和height: 100%;设置了html和body标签也是。
页脚底部有间隙，而不是粘在页面的最底部。显然body元素没有扩展到页面的完整高度，即使html也是如此。

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

Answer 1

像这样的事情会发生DEMO 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;
}

内容div没有填充页面，页脚未对齐

1 个答案: