layout a 3 colonne e problema con clear

[mquaini]

Ciao a tutti,
ho impostato un layout a 3 colonne, i div di dx e sinistra sono float, mentre quello centrale no (ho visto che i layout a 3 colonne sono in generale fatti cosi').

Ora, nel div centrale, dovrei visualizzare dei dati dinamicamente. Impostando il tutto con una table tutto ok, se invece voglio usare un layout con DIV, ho dei problemi poichè se devo usare l' attributo clear per forzare ad espandere il div in base al contenuto, questo mi fa scrollare il contenuto del div centrale sotto i due div sx e dx.

Ho già letto i documenti segnalati nella sezione "LINK UTILI" ma su nessuno di essi ho trovato
la soluzione...

Qualcuno di voi sa come risolvere questo problema?

Grazie

Michele

[Sgro]

Layout a tre colonne + testata con div, fluido (si adatta alle preferenze dell'utente)
Se vuoi rimuovere la testata, basta che togli il div relativo e cambi nei selettori colonnasx, centro e colonnadx la proprietà top avvicinandola al bordo superiore del browser (ad es. 1em)

        #testata
        {
            position : absolute;
            top : 1em;
            left : 0.5em;
            right : 0.5em;
            height : 4em;
            border : 1px solid green;
            text-align : center;
        }

        #colonnasx
        {
            position : absolute;
            top : 6em;
            left : 0.5em;
            min-height : 30em;
            width : 8em;
            border : 1px solid black;
            padding : 0 0.5em;
            text-align : center;
        }
        
        #centro
        {
            position : absolute;
            top : 6em;
            min-height : 30em;
            left : 10em;
            right : 10em;
            border : 1px solid red;
            padding : 1em;
        }
        
        #colonnadx
        {
            position : absolute;
            top : 6em;
            right : 0.5em;
            min-height : 30em;
            width : 8em;
            border : 1px solid black;
            padding : 0 0.5em;
        }

questo è il semplicissimo html

<div id="testata"></div>
<div id="colonnasx"></div>
<div id="centro"></div>
<div id="colonnadx"></div>

Testato su IE6, e IE7, Firefox e Opera, non da problemi di visualizzazione. Se l'utente cambia risoluzione o aumenta/diminuisce la dimensione del testo nel browser, la struttura si adatta automaticamente. Ricorda semplicemente di usare come unità di misura "em" anche per i testi nel sito, in modo che anch'essi si ridimensionino automaticamente.

Per ogni chiarimento, chiedi pure.

Ciao

[mquaini]

Originariamente inviato da Sgro
Layout a tre colonne + testata con div, fluido (si adatta alle preferenze dell'utente)
Se vuoi rimuovere la testata, basta che togli il div relativo e cambi nei selettori colonnasx, centro e colonnadx la proprietà top avvicinandola al bordo superiore del browser (ad es. 1em)

Per ogni chiarimento, chiedi pure.

Ciao

Ciao, sto provando il nuovo layout. Come faccio ad inserire un footer? se lo aggiungo mi si posiziona sugli altri, e non so che coordinate usare con la proprietà absolute

grazie

michele