阻止div宽度将其推出原位

Question

我有两个div并排。其中一个固定为150px（侧边栏），另一个固定为父div的剩余部分。

<div style="margin:0 20%">
    <div style="float:left;width:150px">
        Sidebar contents
    </div>
    <div style="vertical-align:top">
        Main contents
    </div>
</div>

当“main”div的内容超过剩余宽度时，它会在侧边栏下展开并向下推。如何在不定义此div的设置宽度的情况下停止此操作（因为它意味着要调整为父宽度）？

Answer 1

margin-left:150px第二个div？或使用padding-left:150px来对齐内容

Answer 2

http://jsfiddle.net/5TYm2/这是一个我认为你正在寻找的东西的工作示例。

这是在包装div中分离内容的一种非常常见的方法。

希望这有帮助。