Le guide:  Html |  Css |  Javascript |  Php |  Photoshop
Tutorial Css n°4 - del 17-03-2004

Operatore !important CSS2

Molte volte ci siamo trovati ad avere difficoltà a rendere la nostra pagina visibilmente uguale a seconda dell'utilizzo di questo o quel browser, le enormi differenze tra Internet Explorer, nelle versioni precedenti alla 6, e i browser su base Gecko come Mozilla ed Opera costringevano a soluzioni poco pratiche ed a volta differenti per le stesse pagine di un sito.

Il sottoscritto, per esempio, si è trovato proprio difronte questo problema e più precisamente proprio sul sito che state visionando. Il problema è nato quando ho deciso di adottare un Css esterno e quindi di rendere le definizioni in esso contenute ottimali per tutte le pagine e per la maggior parte dei browser.

Ultimato il Css riscontravo che la lunghezza di alcune pagine risultava errata con Mozilla, e in alcuni casi gli oggetti in essa contenuta superavano in lunghezza il proprio contenitore, dopo una serie di ricerche ho scoperto l'operatore !important e le sue caratteristiche.

Se stabiliamo semplicemente una dimensione (height:400px;), se i contenuti occuperanno uno spazio verticale inferiore, allora il box manterrà l'altezza specificata, se, invece, i contenuti occuperanno uno spazio superiore Internet Explorer ignorerà l'altezza specificata e farà espandere il box fino a contenere precisamente tutto. Cosa diversa accade sugli altri browser che a differenza di Explorer non espanderanno il box che risulterà, quindi, inferiore allo spazio occupato dei suoi contenuti.

Il codice da utilizzare per ovviare a questo inconveniente è il seguente:

.contenitore {
min-height: 400px;
height: auto !important;
height: 400px;
}

Queste tre dichiarazioni vengono interpretate in maniera tale che ogni browser possa sistemare in maniera corretta il box:

- La prima viene interpretata correttamente da Mozilla ed Opera ma non da Explorer;
- La seconda serve a non far considerare ai browser come Mozilla ed Opera la terza dichiarazione, altrimenti, se fosse considerata limiterebbe la lunghezza che il alcuni casi risulterebbe insufficente;
- La terza viente interpretata da Explorer correttamente, mentre gli altri daranno priorità alla seconda (!important).



torna all'indice