Vorhandenes Tabellenlayout in DIV umsetzen (float + clear)

[Tanja78]

Hallo,

ich habe jetzt schon viel rumprobiert, aber irgendwie
komm ich mit float und clear nicht ganz klar :-(

Ursprüngliches Layout in Grobform:

<table>

<tr>
<td width=500 colspan=5>Logo</td>
</tr>

<tr>
<td width=10 bgcolor=black>RAND</td>
<td width=100 bgcolor=blue>NAVI</td>
<td width=280>CONTENT</td>
<td width=100 bgcolor=blue>NAVI</td>
<td width=10 bgcolor=black>RAND</td>
</tr>

<tr>
<td width=10 bgcolor=black>RAND</td>
<td colspan=3 width=480 bgcolor=blue>FOOTER</td>
<td width=10 bgcolor=black>RAND</td>
</tr>

</table>

Mein Versuch mit DIVs:

<div style=position:relative;width:500px>Logo</div>

<div style=position:relative;width:10px;clear:left>RAND</div>
<div style=position:relative;width:100px;float:left>NAVI</div>
<div style=position:relative;width:280px;float:left>CONTENT</div>
<div style=position:relative;width:100px;float:left>NAVI</div>
<div style=position:relative;width:10px;float:left>RAND</div>

<div style=position:relative;width:10px;clear:left>RAND</div>
<div style=position:relative;width:480px;float:left>FOOTER</div>
<div style=position:relative;width:10px;float:left>RAND</div>

Total zerschossen würde ich mal sagen ;)