height
Questa proprietà definisce la distanza tra il bordo superiore e quello inferiore di un elemento. Non è ereditata e si applica a tutti gli elementi tranne:
* colonne di tabelle
* elementi inline non rimpiazzati
Sintassi
selettore {height: <valore>;}
Valori
* un valore numerico con unità di misura.
* un valore in percentuale. Il valore in percentuale si riferisce sempre all' altezza del blocco contenitore, purché esso abbia un' altezza esplicitamente dichiarata. Diversamente, la percentuale viene interpretata come auto.
* auto. L' altezza sarà quella determinata dal contenuto.
L' uso di height va sempre valutato con attenzione e non pensando di farne una scorciatoia per avere layout precisi al pixel. Il caso più importante da valutare è quando il contenuto dovesse superare i limiti imposti tramite la proprietà. Il comportamento dei vari browser è al riguardo notevolmente diverso, come si può osservare nell' esempio. Explorer non fa altro che ignorare l' altezza impostata estendendola. Mozilla e Opera rispettano la regola, ma il contenuto eccedente va a sovrapporsi agli elementi vicini o sottostanti. Ricordatelo: molte volte si può ottenere lo stesso risultato visivo desiderato usando proprietà come padding e margin. E considerate sempre che l' altezza è indirettamente influenzata anche dalla larghezza di un elemento.
Esempi
div {height: 250px;}
p.blocco {height: 50%;}
