CSS vertical-align Property


Example

Vertical align an image:

img {
    vertical-align: text-top;
}

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


Browser Support

The numbers in the table specify the first browser version that fully supports the property.

Property
vertical-align 1.0 4.0 1.0 1.0 4.0 


CSS Syntax

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

Property Values

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


Related Pages

CSS tutorial: CSS Text

HTML DOM reference: verticalAlign property



Color Picker

colorpicker