Problema con il float.

dacdam

Problema con il float.

Ciao a tutti.
Ho creato una pagina di questo tipo:

<body>
    <div id="page">
    
        <!-- CORPO DEL SITO -->
        <div id="corpo">
        
            <!-- MENU -->
            <div id="menu_principale">
            </div>  
                        
            <!-- CONTENUTO DELLA PAGINA -->
            <div id="content"></div>              
            
        </div>
        
        <!-- PIEDE PAGINA -->
        <div id="footer">
        </div>  
    
    </div>
</body>

Su "menu_principale" ho impostato il float:left;...
La cosa che non capisco è come mai il div "corpo" non si estende per tutta la lunghezza di "menu_principale". L'effetto che ottengo è che il div "corpo" è troppo corto ed il div "menu_principale" traborda.
Qualcuno sa aiutarmi ?

Ciao e grazie.

claudioweb

Ciao

è del tutto normale, perché gli elementi fluttuanti non "occupano lo spazio", cioè non contribuiscono ad estendere il contenitore.

Puoi risolvere usando la proprietà clear per il footer.

clear:both;

karedas

Ciao Dacdam

Prova in questo modo:


#corpo{
overflow:hidden;
}

A questo punto vedrai che il corpo riuscirà a "sentire" i tuoi elementi floattanti.

Ciao!