Question

奇怪的是，我似乎无法找到任何有这个问题的人。 O_O

代码在IE的结尾与IE，Chrome（和Safari）上的实际页面结尾之间留下了空隙，但在Firefox上却没有。

Vanilla CSS有html, body{ min-height: 100%; height: auto !important; }。 #content position: relative位于#main内#main。

尝试让{{1}}从页面的顶部延伸到底部。

编辑：在玩了更多之后，在我看来，一切都取决于#content在CSS变更计算发生之前加载了整个内容。从一个页面切换到另一个页面允许Chrome（和Safari）为#main设置适当的高度。有什么方法可以“告诉代码等待”吗？虽然我不确定这是否解决了IE的问题

Answer 1

<html>
    <body>
        <div id="main">
            <div id="content">
                <p>content area</p>
            </div>
        </div>
    </body>
</html>

和CSS

html, body {height: 100%; margin: 0; padding: 0}
#main {
    min-height: 100%;
    height: auto !important;
    width: 1024px;
    position: absolute;
    top:0; 
    left:50%;
    margin-left:-512px
}
#content {margin: 135px 0 0 300px}

/* for illustrative purposes */
#main {background-color: #CDE}

查看小提琴
http://jsfiddle.net/UB975/6/

CSS和jQuery：document.height没有正确报告？ div不会垂直伸展

1 个答案: