Vertical alignment

vertical-align

Specify how to vertically align content within a table cell, or within an inline element's boundaries.

Property values

Specify one of these units:

length Aligns the baseline of the element to the given length above the baseline of its parent. A negative value is allowed
percentage Aligns the baseline of the element to the given percentage above the baseline of its parent, with the value being a percentage of the line-height property. A negative value is allowed.

Specify one of these keywords to vertically align the element relative to its parent:

baseline Aligns the baseline of the element with the baseline of its parent
sub Aligns the baseline of the element with the subscript-baseline of its parent
super Aligns the baseline of the element with the superscript-baseline of its parent
text-top Aligns the top of the element with the top of the parent element's font
text-bottom Aligns the bottom of the element with the bottom of the parent element's font
middle Aligns the middle of the element with the baseline plus half the x-height of the parent

Specify one of these keywords to vertically align the element relative to the entire line:

top Aligns the top of the element and its descendants with the top of the entire line
bottom Aligns the bottom of the element and its descendants with the bottom of the entire line

Specify one of these keywords to vertically align table cells:

top Aligns the top padding edge of the cell with the top of the row
middle Centers the padding box of the cell within the row
bottom Aligns the bottom padding edge of the cell with the bottom of the row

Examples

vertical-align: middle;
vertical-align

style > table > vertical-alignVertical alignment

🔎