1

所以我遇到了这个问题，溢出：隐藏在容器中的 div 上会限制 div 的宽度，当它应该是流体时。所以基本上我有一个类似于这样的结构：

<div id="container">
    <div id="leftColumn">
        //content
    </div>
    <div id="rightColumn">
        //content
    </div>
</div>

在这种情况下，leftColumn div 的宽度是固定的，而 rightColumn 应该是流动的并填充剩余的宽度。问题是当我添加溢出：隐藏到 rightColumn（它有背景颜色）时，宽度会缩小到我给它的最小宽度。有没有办法让它扩展到剩余的宽度空间？这是我目前对 CSS 的看法：

#container {
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    min-width: 800px;
}

#leftColumn {
    margin: 0px 0px 0px 0px;
    padding: 10px 10px 10px 10px;
    width: 230px;
    position: relative;
    float: left;
}

#rightColumn {
    margin: 0px 0px 0px 250px;
    padding: 10px 10px 10px 10px;
    min-width: 530px;
    overflow: hidden;
    background: #fff;
}

想法？

4

2 回答 2

0

它完全按照您在我的小提琴中描述的那样工作......缩小到min-width应用程序overflow : hidden。

我讨厌不必要地嵌套 div，但可能这对你有用吗？

http://jsfiddle.net/cVNaJ/

我把你的右栏变成了一个“包装器”，其中overflow : hidden内容包含在一个以原始名称命名的子 div 中。也许这有帮助？

于 2011-01-27T09:27:18.877 回答
0

它对我有用（FF 3.6.13）。检查页面上是否还有其他可能干扰的内容（样式或元素）。还要检查不同的浏览器。如果您在测试时手动更改页面，请务必在浏览器上进行硬刷新 (Ctrl-F5) 以确保加载新样式。

于 2011-01-27T09:05:28.380 回答