Ciao a tutti, sto cercando di capire come si realizzi un layout tableless, io ho scritto cosi:

<style type="text/css">
html body{ border:0;
background-color:black;
}
body { text-align:center;
font-family:verdana,arial,garamond,sans-sefif;
font-style:italic;
font-weight:bold;
font-size:76%;
color: red;
line-height:1.5;
text-decoration:none;
}
div#contenitore { width:640px;
margin:0 180 0 180;
padding:0;
border: white solid;
}
div#head{height:90px;
padding: 15px;
margin: 0;
border: navy solid;
background-color: yellow;
}
div#navigazione{float:left;
width:120px;
padding:10px;
border: red solid;
background-color:white;
}
div#extra{float:right;
width:120px;
padding:10px;
border: red solid;
background-color:white;
}
div#contenuto{ padding:10px;
border:yellow solid;
background-color:green;
}
div#footer{clear:both;
padding:10px;
background-color:yellow;
height:50px;
border:red solid;
}
</style>

il problema è che dentro la pagina che creo le due colonne lateali non proseguono per tutta la lunghezza della pagina e questo provoca un effetto grafico molto brutto.
infatti, appena terminano la colonna centrale con il contenuto si espande anche sotto le colonne.
Io vorrei invece evitare ciò, ed ottenere un layout come quelli spiegati nelle guide.
Grazie
Potete aiutarmi grazie.