Web Design in a Nutshell

Name

vertical-align

Values:

baseline|bottom|middle|sub|super|text-bottom|text-top| top| percentage

Example:

IMG.capletter { vertical-align: text-top }

The vertical-align property, as it sounds, affects the vertical alignment of an element. The possible values are as follows:

baseline

Aligns the baseline (or bottom) with the baseline of the parent element (this is the default)

bottom

Aligns the bottom of the element with the lowest element on the line

middle

Aligns the “vertical midpoint of the element (typically an image) with the baseline plus half the x-height of the parent” (in the words of the CSS1 Specification)

sub

Makes the element a subscript

super

Makes the element a superscript

text-bottom

Aligns the bottom of the element with the bottom of the parent element’s font (its descenders)

text-top

Aligns the top of the element with the top of the parent element’s font (its ascenders)

top

Aligns the top of the element with the tallest element on the line

Percentage values refer to the value of the line-height property of the element.