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;