CSS1 vertical-align Test Page

Each swatch shows a 30pt "TALL" span establishing the line's height, with a highlighted 10pt "aligned" span positioned per the labeled value.

All CSS1 vertical-align keywords

TALL aligned

baseline (default)
vertical-align: baseline

TALL aligned

sub
vertical-align: sub

TALL aligned

super
vertical-align: super

TALL aligned

top
vertical-align: top

TALL aligned

middle
vertical-align: middle

TALL aligned

bottom
vertical-align: bottom

TALL aligned

text-top
vertical-align: text-top

TALL aligned

text-bottom
vertical-align: text-bottom

Length and percentage (CSS 2.1 ยง10.8.1): raises/lowers from the box's own baseline

TALL aligned

length, +8pt (raised)
vertical-align: 8pt

TALL aligned

length, -8pt (lowered)
vertical-align: -8pt

TALL aligned

percentage, 50% (of the span's own line-height)
vertical-align: 50%

TALL aligned

percentage, -50%
vertical-align: -50%