disign.it | Internet explorer hacks | a digital sign for a best design!
A digital sign for a best design
Css tips and tricks 2.523 visualizzazioni

Internet explorer hacks

28/05/2011

Nelle regole CSS min-height stabilisce l'altezza minima di un box e prevede che il box possa poi espandersi oltre l'altezza specificata.
Internet Explorer fino alla versione 6 non lo supporta, come neppure l'operatore !important (!important permette ad una regola di sovrascrivere regole che la seguono).

Nei CSS con height:  invece se i contenuti di un dato box occupano uno spazio verticale inferiore a quello specificato per la proprietà height, allora il box ha l'altezza specificata, se invece i contenuti eccedono lo spazio a loro disposizione, allora Internet Explorer ignora l'altezza specificata e fa espandere il box. Diversamente, Opera, Mozilla e gli altri browser non espanderanno il box che non sarà più in grado di impaginare i contenuti.

La classica soluzione di implementazione di min-height su tutti i browser è questa:

.box {
min-height: 200px;
height: auto !important;
height: 200px;
}


La prima dichiarazione non è interpetata da Internet Explorer.
La seconda dichiarazione serve per Opera, Mozilla e gli altri browser per sovrascrivere la terza dichiarazione che vincolerebbe in ogni caso l'altezza del box (cosa non prevista da min-height). Internet Explorer ignora la direttiva !important.
La terza dichiarazione è interpretata solo da Internet Explorer poiché per gli altri browser la seconda dichiarazione è più importante.
Quindi Internet Explorer intepreterà height come se si trattasse di min-height!

← Scontorni con Photoshop CSS Unita' di misura per le dimensioni →

Invia una domanda o un commento sull'articolo

I campi obbligatori sono segnalati *

*

*



 

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