layout: lati dx e sx continuati (elastici?)

[i_am_antipop]

ciao, vorrei realizzare un layout con i lati sinistro e destro che si adattino alla larghezza del video..

es: 3 colonne, al centro i contenuti.
ai lati la grafica..

Per ora ho provato così :

.Destra {
height:383px;
width:100%;
padding-left:0px;
padding-right:0px;
float:left;
background:#ccc;
border-top:1px solid #fff;
border-bottom:1px solid #fff;
}

ma no nfunge..

qualche dritta?

grazie


Allego bozza.

[i_am_antipop]

ho modificato il template di HTML.it "Layout a tre colonne con float e background" http://css.html.it/guide/lezione/77/...-e-background/

Ho messo una dimensione fissa al div#content.

Andrebbe bene, perchè così i lati dx e sx si adattano in larghezza e il centro rimane fisso.

PERò: se riduco troppo la finestra del browser, div#content finisce "sotto" tra le du colonne lateral...

<style type="text/css">
/*stili per il layout fisso con background*/
html,body{margin: 0;padding:0 width: 100%}
body{font-family: arial,sans-serif;font-size: 76%;text-align:center}
div#container{width:100%; margin:0 auto;
border-width: 0 1px; border-style:solid; border-color: #ccc;
background: url(3rightcol.jpg) repeat-y top right}
div#container2{background: url(3leftcol.jpg) repeat-y top left;text-align: left}

/*stili generici, su header e footer*/
div#header{height: 80px;background-color:#36C;color: #ff0}
h1,h2{margin: 0;padding:0}
h1{padding-left:10px;font: bold 2.3em/80px arial,sans-serif}
h2{color: #69f;font-size: 1.5em}
div#footer a{color:#fff;font-weight: bold;text-decoration: underline}

/*stili specifici per il layout*/
div#navigation{float: left;width: 20%;\width:25%;w\idth:20%;padding: 1em 0 0 5%; background-color:#cfc}
div#extra{float: right; width: 20%;\width:25%;w\idth:20%;padding: 1em 5%; background-color:#cfc}
div#content{width:400px; margin: 0 25%;padding: 1em 10px; background: url(xxxx.jpg) }
div#footer{clear:both; text-align:center; padding: 5px 0;
background-color: #69c; color: #000}

/*stili per la navigazione*/
div#navigation ul{margin: 0;padding: 0; list-style-type: none}
div#navigation li{margin: 0;padding: 0}
div#navigation a{color:#369;font: normal bold 1.2em/1.4em arial,sans-serif;text-decoration: none}
div#navigation a:hover{color: #033;text-decoration: underline}
div#navigation a#activelink{color: #033;text-decoration: none}
div#navigation p{font-size: 90%}

/*stili per la sezione extra*/
div#extra div.newsbox{font-size: 90%;margin-bottom: 2em}
div#extra div.newsbox h2{color: #999;font-size: 1.2em}
div#extra div.newsbox p{margin: 0}

hr {
display: block;
visibility: hidden;
clear:both;
}

</style>