IE中的div宽度问题答案

【问题标题】：Div width problem in IEIE中的div宽度问题
【发布时间】：2011-03-23 00:43:03
【问题描述】：

在发布之前，我阅读了几个与此类似的问题，但没有找到适合我的解决方案。

我的网站中有一个页面不适合我用于其他所有页面的模板，因为为该页面生成的信息表太宽了。为了使表格显示，我使用了overflow-x:visible。结果正是我在除 IE 之外的所有浏览器中想要的。这是我的 div 标签的设置方式：

<body>

     <div id="header"></div>

     <div id="container">

          <div id="left_nav"></div>
          <div id="content" style="overflow-x:visible"></div>

     </div>

</body>

...重要的 CSS 如下所示：

#content {
    background-color: #CCCCCC;
    bottom:0px;
    font-family: Arial,Helvetica,sans-serif;
    font-size:medium;
    font-weight:normal;
    left:270px;
    min-width:505px;/* should be 490px*/
    overflow:auto;
    overflow-x:hidden;
    padding-bottom:20px;
    padding-left:20px;
    padding-right:5px;
    padding-top:10px;
    position:absolute;
    right:0px;
    top:125px;
}
#header {
    background-color: #5DB259;
    font-family: Arial,Helvetica,sans-serif;
    font-size: xx-large;
    font-weight: normal;
    height: 125px;
    left: 0px;
    min-width:800px;
    position: absolute;
    text-align: center;
    width: 100%;
    top: 0px;
}
#leftnav {
    background-color: #999999;
    bottom: 0px;
    font-family: Arial,Helvetica,sans-serif;
    font-size: large;
    font-weight: bold;
    left: 0px;
    overflow: auto;
    padding: 20px;
    position: absolute;
    top: 125px;
    width: 230px;   
}

问题是当浏览器窗口宽度减小时，IE 没有给我两个 x 轴滚动条。结果是我的标题 div 宽度保持在指定的最小宽度 800 像素，而我的内容溢出仍然可见，从而导致我的页面右上角出现一个大的空白矩形。 我在这里错过了什么？

【问题讨论】：

设置<div id="content" style="overflow-x: scroll">时会发生什么？这应该会为您提供您正在寻找的 x 轴滚动条。
它确实给了我滚动条，但没有实际移动的滑块。

标签： internet-explorer html width

【解决方案1】：

尝试使用overflow: auto; 作为内容。

【讨论】：

【解决方案2】：

在搞砸了一天之后，我发现 IE8 兼容模式可以让页面做我想要的，但不幸的是，兼容模式也搞砸了我的 JavaScript。我最终选择了低调的道路，只是用一些 PHP 破解了我的动态 Web 模板，让它做我想做的事。 @#$% IE！

【讨论】：