vertical-align

Браузер	Internet Explorer			Netscape		Opera			Safari		Mozilla	Firefox
Версия	5.5	6.0	7.0	7.0	8.0	7.0	8.0	9.0	2.0	3.0	1.7	1.0	2.0	3.0
Поддерживается	Част.	Част.	Да	Да	Да	Да	Да	Да	Да	Да	Да	Да	Да	Да

Част. — поддерживается частично.

Краткая информация

CSS	CSS1
Значение по умолчанию	baseline
Наследуется	Нет
Применяется	К встроенным элементам или ячейкам таблицы.
Аналог HTML	<caption \| col \| colgroup \| tbody \| tfoot \| thead \| th \| td \| tr valign>
Ссылка на спецификацию	http://www.w3.org/TR/CSS21/visudet.html#propdef-vertical-align

Описание

Выравнивает элемент по вертикали относительно своего родителя или окружающего текста.

Синтаксис

Аргументы

baseline: Выравнивает базовую линию текущего элемента по базовой линии родителя. Если родительский элемент не имеет базовой линии, то за нее принимается нижняя граница элемента.
bottom: Выравнивает основание текущего элемента по нижней части элемента строки, расположенного ниже всех.
middle: Выравнивание средней точки элемента по базовой линии родителя плюс половина высоты родительского элемента.
sub: Элемент изображается как подстрочный, в виде нижнего индекса. Размер шрифта при этом не меняется.
super: Элемент изображается как надстрочный, в виде верхнего индекса. Размер шрифта остается прежним.
text-bottom: Нижняя граница элемента выравнивается по самому нижнему краю текущей строки.
text-top: Верхняя граница элемента выравнивается по самому высокому текстовому элементу текущей строки.
top: Выравнивание верхнего края элемента по верху самого высокого элемента строки.

В качестве значения также можно использовать проценты, пикселы или другие доступные единицы. Положительный аргумент смещает элемент вверх относительно базовой линии, в то время как отрицательное значение опускает его вниз. Не все браузеры поддерживают такой способ записи, в частности, Internet Explorer только с шестой версии.

Пример

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<title>vertical-align</title>
</head>
<body>

<div style="font-family: Times, serif; font-size: 200%">
T<span style="vertical-align: sub">E</span>X и L<span style="vertical-align: 5px; font-size: 80%">A</span>T<span style="vertical-align: sub">E</span>X
</div>

</body>
</html>

Результат данного примера показан ни рис. 1.

Рис. 1

Рис. 1. Применение параметра vertical-align

Объектная модель

[window.]document.getElementById("elementID").style.verticalAlign