estensione div

[webstyler]

Ciao, utilizzo un layout a 3 colone con float.

div#navigazione{
float:left;
/* Inizia il Simplified Box Model Hack */
width:160px; /* Dimensioni per Opera 5 */
\width:170px; /* Dimensioni per Explorer 5.x */
w\idth:160px; /* Dimensioni per browser standard compliant */
border-right: 1px solid #EEE;
background-color: White;
padding-top:20px;
border-right: 1px solid #EEE;

}

div#content{
margin: 0px 140px 0px 160px;
background-color: white;
padding:4px 4px 4px 6px;
}

div#dx{
float:right;
width: 140px;
\width:150px;
w\idth:140px;
background-color: White;
padding-left:2px;
padding-top:20px;
}

PERO' ho 2 problemi :
1. il bordo della navigazione non è lungo come il mio layout ma solo come la navigazione stessa. Il problema è = anche se utilizzo il bordo nei contenuti. Come si può risolvere ?

2. Essendo spesso la navigazione corta dei contenuti, quando questa "termina" i contenuti subiscono un leggero rientro verso sinistra.

ho provato ad usare height:100% nella navigazione ma il bordo, pur essendo + lungo, non continua fino alla fine del layout.
Inoltre mi sembra che sia sconsigliato.

[pierofix]

C'è una soluzione piuttosto innovativa per quanto riguarda i layout a colonne.

Qui un po' di link (guarda i CSS relativi):

- www.simplebits.com
- www.itgmarinoni.it

E qui l'articolo in questa tecnica è illustrata:

- http://www.alistapart.com/articles/fauxcolumns/

[webstyler]

uhm..
così non funge .. il bordo rimane cmq lungo come il content.. ma non ha senso

div#corpo{
background: White url(images/varie/sfondo_container.gif) repeat-y 50% 0;
}

div#container{
width:750px; /* Dimensioni per Opera 5 */
\width:760px; /* Dimensioni per Explorer 5.x */
w\idth:750px; /* Dimensioni per browser standard compliant */
background-color: White;
text-align:left;
}

[webstyler]

div#corpo{
}

div#container{
background: White url(images/varie/sfondo_container.gif) repeat-y;
width:750px; /* Dimensioni per Opera 5 */
\width:760px; /* Dimensioni per Explorer 5.x */
w\idth:750px; /* Dimensioni per browser standard compliant */
text-align:left;
}

Così sembra funzionare, nel senso che il bordo ora è OK

Però permane il problema del margine .. allego img per chiarire

[webstyler]

non riesco a correggere questo errore