disign.it | CSS la proprieta' overflow per sostituire il clear! | a digital sign for a best design!
A digital sign for a best design
Css tips and tricks 6.010 visualizzazioni

CSS la proprieta' overflow per sostituire il clear!

11/05/2011

Quante volte in un design complesso ci siam trovati nelle condizioni che il wrapper non adeguasse automaticamente la sua altezza in base ai contenuti? Da qualche parte ci siamo dimenticati di chiudere un float attraverso l'uso della proprietà CSS clear: both!
E anche se tutto funziona perfettamente abbiamo dovuto utilizzare un DIV in più, strumentale all'applicazione del clear.

Quanti sanno che si può molto semplicemente utlizzare la proprietà overflow per superare il problema?

Nella prima demo che vi propongo potete vedere in sequenza l'errore causato dalla dimenticanza del clear, la soluzione classica con l'aggiunta di un DIV extra per applicare il clear e la soluzione più semplice e breve di applicazione dell'overflow: auto al wrapper.
Nella seconda demo potete vedere come sia possibile invece utilizzare la proprietà overflow: auto per fare in modo che un contenuto di testo non contorni un'immagine a cui abbiamo applicato un float: in questo modo evitiamo di dover assegnare al box del testo una larghezza e un altro float!

← Javascript per mostrare un div e chiudere dinamicamente tutti gli altri che desideriamo MASSIMO SIRAGUSA di Sandro Fogli →

Invia una domanda o un commento sull'articolo

I campi obbligatori sono segnalati *

*

*



 

© 2009 - 2017 Impronte digitali di Luca Frassineti. Tutti i diritti riservati.