Question

问题在于：我有一个HTML：

<div id="container">
    <div id="fixedImg"></div>
        <div id="content" class="clearfix">
    asdf <br />    asdf <br />
    df<br />asdf <br />    asdf <br />
    df<br />asdf <br />    asdf <br />
    df<br />asdf <br />    asdf <br />
    df<br />asdf <br />    asdf <br />
    df<br />asdf <br />    asdf <br />
    df<br />asdf <br />    asdf <br />
    df<br />asdf <br />    asdf <br />
    df<br />asdf <br />    asdf <br />
    df<br />asdf <br />    asdf <br />
    df<br />asdf <br />    asdf <br />
    df<br />asdf <br />    asdf <br />
    df<br />asdf <br />    asdf <br />

    </div>
</div>

和相关的CSS

#container {
    width: 990px;
    margin-right: auto;
    margin-left: auto;
    padding-top:14px;

}
#fixedImg {
    float: left;
    width: 300px;
    background-image: url(../images/pageBg.jpg);
    background-repeat: repeat-y;
}
#content {
    float: left;
    width: 690px;
    border-bottom: solid #000 1px;
    background-color:#CC0000;
    overflow:auto;
}

但是当我在任何浏览器（IE，Chrome）中渲染它时，来自'Content'div的内容正在溢出。

内容div根据窗口高度动态获取高度（使用JavaScript函数正确获取）。文本/内容应使用滚动条格式化。

解决：

问题出在我的JavaScript函数内部，在我将高度分配给'Content'div的行，我指的是minHeight而不是高度。更正后的代码行如下。

document.getElementById('content').style.height = ht;

现在它的工作正常。我给JavaScript函数如何计算屏幕：

<script language="javascript">
function getscreenInfo () {
var w = window,
    d = document,
    e = d.documentElement,
    g = d.getElementsByTagName('body')[0],
    x = w.innerWidth || e.clientWidth || g.clientWidth,
    y = w.innerHeight|| e.clientHeight|| g.clientHeight;
    ht = y - 197;

    y += "px";
    document.getElementById('footer').style.top = y; // this will keep the 'footer' div below the visible screen. User will look at it only if he scrolls down to the bottom.
    ht += "px";
    //alert(ht);
//alert (document.getElementById('footer').style.top);
    document.getElementById('fixedImg').style.height = ht;
    document.getElementById('content').style.height = ht;

}
</script>

Answer 1

#container{
overflow:scroll;
}

添加此行，应该可以。

Answer 2

这是你的探测器的解决方案：

你必须在div css中使用 {height：auto;} 。

为什么我的内容溢出div？

2 个答案: