L'allineamento in verticale del testo e di altri contenuti all'interno di elementi quali DIV contenitori o celle di una tabella è spesso problematico.

Nel "vecchio" HTML e nei layout tabellari ormai in disuso, per centrare un elemento all'interno della cella si usava la proprietà HTML "vertical-align: middle", dichiarata nelle proprietà HTML della cella stessa.

Purtroppo questa proprietà obsoleta non è assolutamente applicabile per i DIV; "vertical-align: middle" non funziona nei fogli di stile nemmeno per il posizionamento all'interno delle celle di una tabella...

Ed allora, come centrare verticalmente il contenuto all'interno di un elemento contenitore?

La soluzione consiste nell'uso della proprietà "line-height" - che determina l'ampiezza dell'interlinea.

Specificando un valore di "line-height" uguale all'altezza dell'elemento contenitore, il contenuto sarà allineato in verticale al centro dello stesso.

Enjoy It!