html - 2 列带 DIV ....第二个最大尺寸

Question

我有这段代码:

<div id="containerDiv" style="background-color:Lime;">
    <div style="float:left;width:150px; background-color:Red;">
        AAAA
    </div>
    <div style="float:left;background-color:Fuchsia;margin-left:10px;">
        BBBB
    </div>
    <br style="clear:both;" />
</div>

第一列具有固定大小，我希望第二列具有容器 div 中可用的其余部分。

有什么想法吗？

更新一: 我的代码给出了这个:http://tinypic.com/r/103x65e/6 我希望洋红色到达箭头处

谢谢，

Answer 1

可以将第二列的左边距改为150px+10px=160px，去掉float:left。此外，您可以按照 Staicu 的说明添加 clearfix 类，这样就不需要带有“clear:both”的 BR 元素。如果你想让两列的高度相同，你可以使用 Staicu 所说的 Faux Column 技巧。如果 Internet Explorer 出现问题，您可以使用 positioniseverything 上的信息修复它

<div id="containerDiv" style="background-color:Lime;" class="clearfix">
    <div style="float:left; width:150px; background-color:red;">
        AAAA
    </div>
    <div style="background-color:fuchsia; margin-left:160px;">
        BBBB
    </div>
</div>