Il testo che esce dal box…
Quante volte vi è capitato di aver fissato le dimensioni in altezza di un box, salvo poi trovarvi con il testo che sforava su Firefox? Con Explorer invece tutto ok, il box si allungava…
Ebbene non è Firefox che sbaglia, ma esiste una proprietà detta min-height che si può usare a tal proposito, ma che ovviamente Explorer non interpreta bene. Al contempo Explorer non interpreta il comando !important per cui ecco il giusto compromesso e la soluzione, suggerita da Gianluca Troiani:
Implementare min-height anche su Internet Explorer
[...]
LA SOLUZIONE
Sfuttando i due difetti di interpretazione precedentemente esposti, è possibile ottenere l’implementazione di min-height su tutti i browser.
Il codice da utilizzare è il seguente:
.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 non dà peso alla direttiva !important.
La terza dichiarazione è interpretata solo da Internet Explorer poiché per gli altri browser la seconda dichiarazione è più importante. In ogni caso Internet Explorer intepreterà height come se si trattasse di min-height.
L'Autore
Laura Gargiulo, webdesigner freelance. Web architect senior, esperta xhtml, css, usabilità, design, cms, webmarketing e Seo, Wordpress specialist. Membro del progetto di prossima pubblicazione Piperita Lab e dell'IWA Italy Visita il mio sito personale Lauryn.it e contattami pure per un preventivo gratuito.
Add to Google
5 Commenti
Una cosa del genere succede con tutti i browser. Ognuno interpreta a modo suo l’altezza del testo. Io almeno con gli em vedo sta cosa.
No, comunque una cosa del genere non mi è mai successa
Neppure a me è mai successo il testo sforasse dal box però il trucchetto del min-height lo uso comunque nei layout.
Non vi è mai capitato perchè molto probabilmente, come è giusto, progettate partendo da firefox e solo dopo andate a testare su explorer, sbaglio?
a me succedeva infatti quando facevo il contrario…
Ottima questa soluzione, mi succedeva spesso all’interno del box centrale dei testi anche a me. L’ho risolto usando un box assoluto per (quello che contiente tutto) non ho avuto più problemi…cmq questa cosa la proverò…
@Lauryn: si, infatti parto a progettare con Firefox e poi faccio il controllo crossbrowser anche se dovrei farlo di pari passo per non trovarmi alla fine con problemi inaspettati. :/