[cssdesign] altezza 100% e div annidati

Gio 10 Nov 2005 23:58:57 CET

ciao a tutti,

torno di nuovo sul problema di 2 giorni  (estensione colonna con IE) fa 
perchè non ho ancora risolto :-(

..vedo di spiegarmi meglio.

La struttura della mia pagina è la seguente

<body>
<div id="page">

<div id="nonFooter">
    <div id="container">
        <div id="area-left">
            <div id="body1">
            </div>
        </div>

        <div id="area-right">
            <div id="menu1"></div>    
            <div style="clear: both;"></div>
            <div id="menu2"></div>
            <div style="clear: both;"></div>
            <div id="body2">
            </div>
        </div>
    </div>
    <!-- fine #container -->
</div>
<!-- fine #nonFooter -->
</div>
<!-- fine #page -->
<div id="footer"></div>
</body>

..la pagina deve occupare il 100% dell'altezza.
..la parte testuale è presente in body2 ed è quella che determina 
l'altezza totale della pagina

..ora dopo diverse prove ho scoperto che:
1) se setto overflow: hidden oppure overflow: auto su #page, #nonFooter 
e #container funziona tutto a meraviglia su Firefox
2) se non metto overflow funziona tutto su Explorer

Quando dico funziona a meraviglia intendo che:
1) se body2 contiene poco testo, il footer è cmq posizionato in fondo 
alla pagina
2) quando body2 contiene tanto testo la pagina si estende
3) quando modifico la dimensione del font la pagina si estende

Quindi domande:
1) Perchè overflow fa funzionare FF ma non IE ?
2) Come devo impostare la proprietà overflow in modo tale che la 
interpreti FF e non IE?

Grazie

Matteo