Ausrichtung von Inhalten in Tabellenzellen
  baseline (CSS1) ist die Voreinstellung und richtet den Text unten auf der Grundlinie aus. Die Angabe von baseline stellt sicher, dass vorangegangene Deklarationen den gewählten Text nicht beeinflussen. bottom (CSS1) richtet Zeichen, Wörter, Buchstaben und Texte anhand des niedrigsten Zeichens auf einer Linie aus. middle (CSS1) richtet alle gewählten Zeichen, Buchstaben oder Texte auf dem Mittelpunkt der gleichen Linie aus.
  .ibaseline {vertical-align: baseline;} .ibottom {vertical-align: bottom;} .imiddle {vertical-align: middle;}
Die Fliege in der Zeile Die Fliege in der Zeile Die Fliege in der Zeile
  sub (CSS1) stellt die gewählten Zeichen, Buchstaben, Wörter oder Texte als Subscript dar. super (CSS1) stellt die gewählten Zeichen, Buchstaben, Wörter oder Texte als Superscript dar. text-bottom (CSS1) richtet alle gewählten Zeichen, Buchstaben, Wörter oder Texte unter der Grundlinie der Zeile aus.
  .isub { vertical-align: sub; } .isuper { vertical-align: super; } .itext-bottom { vertical-align: text-bottom; }
Die Fliege in der Zeile Die Fliege in der Zeile Die Fliege in der Zeile
  text-top (CSS1) richtet alle gewählten Zeichen, Buchstaben, Wörter oder Texte am höchsten Zeichen der Schrift aus. top (CSS1) richtet alle gewählten Zeichen, Buchstaben, Wörter oder Texte an der oberen Kante der Zeilenhöhe aus. percentage (CSS1) basiert auf der Zeilenhöhe. Die Grundlinie wird als 0% betrachtet, die Zeilenhöhe als 100%. Der Prozentsatz kann positiv oder negativ sein und kann 100% überschreiten. Ein negativer Prozentsatz richtet die Elemente unter der Grundlinie aus und ein positiver Prozentsatz richtet sie über der Grundlinie aus.
  .itext-top { vertical-align: text-top; } .itop { vertical-align: top; } .prozent { vertical-align: -15%; }
Die Fliege in der Zeile Die Fliege in der Zeile Die Fliege in der Zeile
  length (CSS2) hebt oder senkt alle Elemente um den angegebenen Betrag über oder unter die Grundlinie. Ein positiver Wert hebt und ein negativer Wert senkt die Elemente. Der Wert 0 entspricht der Grundlinie.  
  .minuspix { vertical-align: -10px; } .plusem { vertical-align: 0.5em; } .plusmm { vertical-align: 1mm; }
Die Fliege in der Zeile Die Fliege in der Zeile Die Fliege in der Zeile

 

Ausrichtung von Inhalten in Tabellenzellen

Die Werte bottom, middle und top richten Texte und Bilder innerhalb von Tabellenzellen aus.

 
  bottom (CSS1) richtet Inhalte von Tabellenzellen am unteren Rand der Zelle aus. Kommen weitere Zeilen hinzu, wird die erste Zeile nach oben versetzt. middle (CSS1) ist die Vorgabe und richtet Inhalte von Tabellenzellen an der Mittellinie der Zelle aus. Beachten Sie dabei, dass die erste Zeile in einer Tabellenzelle auf der Mittellinie der Zelle ausgerichtet wird, während in einer Zelle mit zwei Zeilen die beiden Zeilen jeweils über und unter der Mittellinie ausgerichtet werden. top (CSS1) richtet Inhalte von Tabellenzellen am oberen Rand der Zelle aus. Weitere Zeilen werden unterhalb der vorangegangenen Zeilen ausgerichtet.
  .ibottom {vertical-align: bottom;} .imiddle {vertical-align: middle;} .itop { vertical-align: top; }
Der Text in der Tabellenzelle Der Text in der Tabellenzelle Der Text in der Tabellenzelle
Ein Text über mehrere Zeilen innerhalb einer Tabellenzelle Ein Text über mehrere Zeilen innerhalb einer Tabellenzelle Ein Text über mehrere Zeilen innerhalb einer Tabellenzelle