Despite being a reasonably advanced .net web / Sql Server developer - I struggle with css. Something I can never get to work is how to duplicate this.
<table> <tr> <td rowspan="2">Left</td> </tr> <tr> <td>Right Top</td> <td>Right Bottom</td> </tr> </table>
How can you reproduce this using divs and css?
If I write, for example ...
<div style="float:left; height:100px;">Left</div> <div style="float:left; height:50px">Right Top</div>
... that puts two divs horizontally next to each other, but how can I get ...
<div style="height:50px">Right Bottom</div>
... to sit below Right Top and to the right of Left?
Thanks for any help. If I could find out how to do this I would be able to use css layouts. As it is I nearly always start with a css layout and, after messing around for hours trying to get things where I want them, give up and go back to tables.
If I understand correctly?
If I understand correctly? float:right; clear:both;
Thanks for your reply but it
Thanks for your reply but it doesn't do it.
That puts the Right Bottom div at the extreme right and below the Left Div and the Right Top div.
I want the Right Bottom div directly below the Right Top div with both of them to the right of the Left div.
This is the standard sort of thing I want to do within, say, a header div that might be 800px wide and 100 px high.
Within that header div I want:
A logo on the left - 100px high
A telephone number to the right of the logo
Some navigation links to the right of the logo - below the telephone number
So where does the bottom
So where does the bottom float end up?
The only reason it wouldn't be directly below the top right is if the parent width was greater than the two top floats in which case you might need a containing div that holds all these elements and has a stated width and float containment of some type so that the bottom float has a right edge to float up against.