html - 如何使两列布局的主 div 自动适应浏览器宽度？

Question

我有两个 <div>并排放置，采用两列布局。我想让第二个 div 宽度自动适应浏览器宽度...但我的 CSS 不太有效:

<style>
#sidebar{
    float:left;
    width:230px;    
    min-height:10px;
    overflow:hidden;
    margin:auto;
}

#content{
    float:left;
    width:auto;
    min-height:10px;
    overflow:hidden;
    margin:auto;
    background-color:#cddfea;
}
</style>


<div id="sidebar">aa</div>

<div id="content"></div>

当我的边栏宽度为 230 像素时，如何使“内容”div 的宽度适合浏览器窗口的其余部分？

谢谢。 :)

Answer 1

试试这个: jsFiddle

HTML:

<div id="sidebar">aa</div>
<div id="content">bb</div>

CSS:

#sidebar{
    float:left;
    width:230px;    
    min-height:10px;
    overflow:hidden;
    margin:auto;
    background: #faa;
}

#content{
    min-height:10px;
    overflow:hidden;
    margin-left:230px;
    background:#cddfea;
}