Div Positioning

Position 3 div's inside another

[colandy]

Hi All,

I have an issue that I'm not sure quite how to resolve. I have one div lets call it 'Main' that has a specific Height and Width. Within this I want to position 3 other divs (div 1, 2 & 3) div 1 is to be in the top left corner of the 'Main' div, 2 is to be in the top right corner of the 'Main' div and 3 is to run along the bottom of the 'Main' div.

Doing this with the absolute positioning is not possible as the 'Main' div can appear anywhere on the page. Ideally I'd like to position the divs (1,2 & 3) with absolute positions within the 'Main' div(if you see aht I mean).

The HTML will will be:

<div id='main'>
<div id='1'></div>
<div id='2'></div>
<div id='3'></div>
</div>

Simple I would have thought, but causing me headaches........

[PublicSphere]

You could float all three divs left, define 1 & 2 as width: 50%, and define 3 as width: 100%.

That should work.

If not float the top 2 left, and clear them in the third with clear: left.

[colandy]

Knew it was something simple.....many thanks.