Eccoci qua a parlare di min-height....di css...
Come ben saprete questa comodissima proprietà ha diversi problemi di visualizzazione su alcuni browser...
Giusto per citarne qualcuno, cosí eh, per caso ;-), explorer...ma la tristezza (almeno per me)
anche Safari dalla versione 1.2
Dunque.
Tempo fa per ovviare il problema su explorer utilizzavo questo tipo di hack, trovato in rete,
in particolare sul sito www.constile.org
.box {min-height: 200px;
height: auto !important;
height: 200px;
}
In pratica la prima riga serve per quei browser che, seguendo le direttive del W3C,
implementano correttamente la dichiarazione min-height,
quindi non è interpretata da Internet
Explorer. La seconda dichiarazione serve per Opera e Mozilla
per sovrascrivere la terza che altrimenti
vincolerebbe l'altezza del box.
Infatti l'operatore !important (ovviamente non supportato
da explorer) serve in pratica per sovrascrivere regole che la seguono.
Quindi passiamo alla terza dichiarazione,
interpretata solo da explorer, che permette a questo amato browser di considerare height come se fosse min-height.
E qui il gioco è fatto, funziona tutto.
Se non che, a partire da Safari 1.2
, anche questo browser mac inizia a non supportare più
la dichiarazione min-height.
Quindi ho continuato la ricerca e ho trovato in rete questo articolo:
min height
Qui viene spiegato come risolvere il problema in Safari, e su tutti i browser:
div{
display:table-cell;
height:100px;
}
A quanto ho capito i browser, compreso Safari, considerano il nostro div
come se fosse un elemento di una tabella, e crea elementi intorno ad esso
permettendo quindi di far quello che a noi serve.
Internet explorer ignora questa proprietà display e tramite height riusciamo a
impostare il min-height.
Peccato però che su Explorer Mac non funzioni ancora nulla, purtroppo.
ORa mi sto dannando per trovare in giro qualche hack per Explorer/MAc,
spero di riuscire in questa impresa.....vi terrò aggiornati!!!
Dopo lunghe ed estenuanti ricerche la soluzione è arrivata!!!!
Non credo di essere in grado di spiegarla, posto semplicemente
il link...in pratica è un modo per simulare il min-height...
Link
Buona navigazione!
Come ben saprete questa comodissima proprietà ha diversi problemi di visualizzazione su alcuni browser...
Giusto per citarne qualcuno, cosí eh, per caso ;-), explorer...ma la tristezza (almeno per me)
anche Safari dalla versione 1.2
Dunque.
Tempo fa per ovviare il problema su explorer utilizzavo questo tipo di hack, trovato in rete,
in particolare sul sito www.constile.org
.box {min-height: 200px;
height: auto !important;
height: 200px;
}
In pratica la prima riga serve per quei browser che, seguendo le direttive del W3C,
implementano correttamente la dichiarazione min-height,
quindi non è interpretata da Internet
Explorer. La seconda dichiarazione serve per Opera e Mozilla
per sovrascrivere la terza che altrimenti
vincolerebbe l'altezza del box.
Infatti l'operatore !important (ovviamente non supportato
da explorer) serve in pratica per sovrascrivere regole che la seguono.
Quindi passiamo alla terza dichiarazione,
interpretata solo da explorer, che permette a questo amato browser di considerare height come se fosse min-height.
E qui il gioco è fatto, funziona tutto.
Se non che, a partire da Safari 1.2
, anche questo browser mac inizia a non supportare più
la dichiarazione min-height.
Quindi ho continuato la ricerca e ho trovato in rete questo articolo:
min height
Qui viene spiegato come risolvere il problema in Safari, e su tutti i browser:
div{
display:table-cell;
height:100px;
}
A quanto ho capito i browser, compreso Safari, considerano il nostro div
come se fosse un elemento di una tabella, e crea elementi intorno ad esso
permettendo quindi di far quello che a noi serve.
Internet explorer ignora questa proprietà display e tramite height riusciamo a
impostare il min-height.
Peccato però che su Explorer Mac non funzioni ancora nulla, purtroppo.
ORa mi sto dannando per trovare in giro qualche hack per Explorer/MAc,
spero di riuscire in questa impresa.....vi terrò aggiornati!!!
Dopo lunghe ed estenuanti ricerche la soluzione è arrivata!!!!
Non credo di essere in grado di spiegarla, posto semplicemente
il link...in pratica è un modo per simulare il min-height...
Link
Buona navigazione!