jquery - CSS 和 jQuery : document. 高度没有正确报告? div 不会垂直拉伸(stretch)

标签 jquery css html

奇怪的是,我似乎找不到遇到此问题的人。 O_o

Pastebin

代码在 IE、Chrome(和 Safari)上的#main 末尾和实际页面末尾之间留有间隙,但在 Firefox 上没有。

Vanilla CSS 有 html, body{ min-height: 100%;高度:自动!重要; }#content#main 中的 position: relative

试图让 #main 从页面顶部延伸到底部。

编辑:在尝试了更多之后,在我看来,一切都取决于 #content 在 CSS 更改计算发生之前加载其全部内容。从一个页面切换到另一个页面允许 Chrome(和 Safari)为#main 设置合适的高度。有什么办法可以“告诉代码等待”吗?虽然我不确定这是否解决了 IE 的问题

最佳答案

<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}

查看 fiddle
http://jsfiddle.net/UB975/6/

关于jquery - CSS 和 jQuery : document. 高度没有正确报告? div 不会垂直拉伸(stretch),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5010961/

相关文章:

android - 3 div 的 : 2 toggles, 1 在 ios 上用外部点击关闭切换

html - 文本转换是否为 : Capitalize work for <option> elements,?如果是,在哪些浏览器中?

jquery - 我可以在 div 上使用自定义属性吗?

python - 当在源中找不到 URL 时,从 Google 本地搜索中提取网站(URL)吗?

javascript - 获取文本区域中的插入符号 XY 坐标

javascript - 将对象数组添加到 jquery-ui 自动完成中

javascript - 使用jquery插件使来自不同表的两个td可排序

html - 列属性未正确对齐

javascript - 根据状态更改 Bootstrap 字形

javascript - `function (n) { .. }(jQuery)`是什么意思?