Problema layout a 3 colonne (altezza100%)

[Bladem84]

Ho trovato su html.it questo layout che fa al caso mio, solamente che provando a ridimensionare le colonne laterali sfasa tutto

come potrei risolvere? o eventualmente esistono altre alternative per avere un layout del genere con colonne a larghezza fissa ed height:100%? mi interessa in pratica che le due laterali adattino il loro sfondo quando il corpo centrale si allunga

codice html:

<div id="container">
<div id="header"></div>
<div id="main">
    <div id="content"></div>
    <div id="nav"></div>
</div>
<div id="extra"></div>
<div id="footer"></div>
</div>

codice css:

html,body{margin:0;padding:0}
body{font: 100.01% "Trebuchet MS",Verdana,Arial,sans-serif;
   background: #FFFFCC;color: #555;text-align:center}
h1{margin: 0;padding: 30px 0 10px 5px;font-size: 600%;color: #FF744C}
h2,h3,h4{margin:0;padding-left: 5px;line-height: 30px;color: #333}
h2{font-size: 160%}
h3{font-size:130%}
h4{font-size:120%}
p{margin: 0 5px;padding: 0 0 0.7em}
div#container{width:760px;margin: 0 auto;
    background: url(3col.jpg) repeat-y;text-align:left}
div#header{background: #DBF8B4}
div#main{float:left;width:540px}
div#content{float:right;width:400px}
div#nav{float:left;width:140px;font-size:85%}
div#extra{float:right;width:220px;font-size:95%}
div#footer{clear:both;width:100%;padding-top:5px;background: #D0B4F8}

azz mi sono appena accorto che il css sfrutta un'immagine di sfondo, togliendola lo sfondo dei div non copre tutto. A me interessa proprio quello, ma senza usare "trucchi"

[Bladem84]

ok leggendo qualche vecchia discussione risulta che il metodo che volevo scartare (immagine ripetuta nel contentenitore) è quella più utilizzata e che risolve il problema a monte

ma possibile che con tutte ste potenzialità dei css che tanto si osannano, bisogna ricorrere ad un metodo del genere? :master: