Floats

[rockinaway]

This is what I want doing: http://www.etcworld.co.uk/position.jpg. The orange boxes are the ones which are supposed to float left, and the grey is right. How will I get the orange ones underneath each other without using <br />? (I can't add a margin as this means the grey box is also moved down.. both have to be equal

[bronzemonkey]

Can't really tell without seeing the complete code that you're using. But try adding {clear:left} to the element that you're floating left.

[rockinaway]

That moves the sidebar into 1 column, but the grey bit only moves up so that it is in level with the second orange block, and not the first...

[dbrimlow]

Your structure needs to be contained within a regular column-like format.

 

You need to remove the floats and put the login and title blocks into a left column "wrap" .

 

Remove the floats for the "Register" block and put it into a "right" column wrap.

 

Something like this:

#left {width:24%; float:left; margin:10px .5em}

 

#right {width:70%; float:left; margin:10px .5em}

 

<div id="left">

all left side content

</div>

 

<div id="right">

all right side content

</div>

 

Tweak widths to suit.

 

But bronzemonkey's right, without seeing how you code the blocks (using lists, headers, etc) it is impossible to really help.