CSS vertical-align Property

Vertical align an image:

img.a {
vertical-align: baseline;
}img.b {
vertical-align: text-top;
}img.c {
vertical-align: text-bottom;
}img.d {
vertical-align: sub;
}img.e {
vertical-align: super;
}

Try it Yourself »


Definition and Usage

The vertical-align property sets the vertical alignment of an element.

Default value: baseline
Inherited: no
Animatable: yes. Read about animatable – Try it
Version: CSS1
JavaScript syntax: object.style.verticalAlign=”top”Try it

CSS Syntax

vertical-align: baseline|length|sub|super|top|text-top|middle|bottom|text-bottom|initial|inherit;

Property Values

Value Description
baseline The element is aligned with the baseline of the parent. This is default
length Raises or lower an element by the specified length. Negative values are allowed. Read about length units
% Raises or lower an element in a percent of the “line-height” property. Negative values are allowed
sub The element is aligned with the subscript baseline of the parent
super The element is aligned with the superscript baseline of the parent
top The element is aligned with the top of the tallest element on the line
text-top The element is aligned with the top of the parent element’s font
middle The element is placed in the middle of the parent element
bottom The element is aligned with the lowest element on the line
text-bottom The element is aligned with the bottom of the parent element’s font
initial Sets this property to its default value. Read about initial
inherit Inherits this property from its parent element. Read about inherit