La propriété CSS vertical-align permet de modifier l’alignement vertical des éléments sur lesquels elle est appliquée.

#mon_identifiant {
vertical-align: sub;
}

Elle permet de modifier l’alignement vertical.
Les valeurs possibles sont:

  • numérique positive ou négative en pixel(px),  en pourcentage(%), en poitn(ex) ou em.Le point de départ sera baseline pour les valeurs fixes et pour les pourcentages dépend de line-height.
  • baseline: alignée, valeur par défaut.
  • sub: ligne de base de l'enfant aligné un peu plus bas que la ligne de base de son parent.
  • super: ligne de base de l'enfant aligné un peu plus bas que la partie la plus haute des caractères de son parent.
  • text-top, alignement sur les parties les plus hautes.
  • text-bottom, alignement sur les parties les plus basses.
  • middle, alignement par le milieu vertical.
  • top, le haut de l'enfant est aligné sur la partie la plus haute de la ligne.
  • bottom, le bas de l'enfant est aligné sur la partie la plus basse de la ligne (sauf IE).
  • inherit, hérite de la propriété de son parent

Exemple :

CSS
.bas{
vertical-align:sub;
}
HTML
<p><span class="bas">Lorem</span> ipsum </p>

Lorem ipsum