Proprietà CSS vertical-align

Definizione e uso

L'attributo vertical-align imposta il modo di allineamento verticale dell'elemento.

Spiegazione

Questa proprietà definisce l'allineamento verticale della linea di base dell'elemento inline rispetto alla linea di base della riga in cui si trova. È possibile specificare valori negativi di lunghezza e percentuali. Questo farà sì che l'elemento si riduca piuttosto che aumentare. Nelle celle della tabella, questa proprietà imposta il modo di allineamento del contenuto delle celle nel riquadro della cella.

Vedere anche:

Tutorial CSS:Testo CSS

Manuale di riferimento HTML DOM:Attributo verticalAlign

Esempio

Allinea verticalmente un'immagine:

img
  {
  vertical-align:text-top;
  }

Prova personalmente

Sintassi CSS

vertical-align: baseline|length|sub|super|top|text-top|middle|bottom|text-bottom|initial|inherit;

Valore dell'attributo

Valore Descrizione
baseline Predefinito. L'elemento viene posizionato sulla linea di base del genitore.
sub Allinea verticalmente il testo in pedice
super Allinea verticalmente il testo in sovrascrittura
top Allinea l'elemento con il punto più alto dell'elemento più alto nella riga.
text-top Allinea l'elemento con il punto più alto del font del genitore.
middle Posiziona questo elemento nel centro del genitore.
bottom Allinea l'elemento con il punto più basso dell'elemento più basso nella riga.
text-bottom Allinea il fondo dell'elemento con il fondo del font del genitore.
length 　
% Utilizza i valori percentuali dell'attributo "line-height" per allineare questo elemento. È possibile utilizzare valori negativi.
inherit Definisce che l'attributo vertical-align deve essere ereditato dal genitore.

Dettagli tecnici

Valore predefinito: baseline
Ereditarietà: no
Versione: CSS1
Sintassi JavaScript: object.style.verticalAlign="bottom"

Altri esempi

Allineamento verticale dell'immagine
Questo esempio dimostra come allineare verticalmente un'immagine nel testo.

Supporto del browser

I numeri nella tabella indicano la versione del browser che supporta completamente l'attributo.

Chrome IE / Edge Firefox Safari Opera
1.0 4.0 1.0 1.0 4.0