Semi liquid layout

[jstam]

Hello,

I am trying to create a semi-liquid layout for three columns. The left and right columns contain a sidebar and an image, respectively, and I'd prefer to maximize space usage by avoiding a completely liquid layout.

Unfortunately, my code is on another computer right now, but this is the gist of what I am using:

<div id="left" style="width:175px; margin-left:5px; float:left"></div>

<div id="main" style="margin-left:181px; margin-right:151px"></div>

<div id="right" style="float:right; width:150px;"></div>

My problem is that the right <div> always ends up below the left and main <div>s, which are on the same row. How can I avoid this problem?

Thanks

[D_Blackwell]

Try changing the order in which the <div>s are called. Try the two floated <div>s first, then call for the main, which should now slide up between.

<div id="left" style="width:175px; margin-left:5px; float:left"></div>

<div id="right" style="float:right; width:150px;"></div>

<div id="main" style="margin-left:181px; margin-right:151px"></div>

[jstam]

It worked! Thanks a lot