Question

I’ve got 2 divs side by side. One has a fixed with of 150px (sidebar) and one adjusts to the remaining with of the parent div.

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

When the contents of the “main” div exceed the remaining width, it’s expanded and pushed down under the sidebar. How can I stop this without defining a set width for this div (since it’s meant to adjust to the parent width)?

Answer 1

margin-left:150px for the second div? or use padding-left:150px for aligning content