CSS-свойство vertical-align

CSS-свойство vertical-align управляет вертикальным выравниванием встроенных элементов (inline), таких как текст и изображения, относительно базовой линии родительского блочного элемента или ячейки таблицы в ряду.

Значение по умолчанию:	`baseline`
Применяется к:	Строчные элементы и ячейки таблиц (table cells)
Наследование:	Нет
Анимирование:	Да. Анимируемые свойства
Версия:	CSS 1, 2, 3

Синтаксис

Синтаксически свойства задаются по следующему шаблону:

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

Примеры написания кода свойства vertical-align:

img {
    vertical-align: middle;
}
span {
    vertical-align: super;
}

Значения свойств

В следующей таблице описаны значения этого свойства.

Значение	Описание
`baseline`	Устанавливает выравнивание элемента по базовой линии родительского блока.
`sub`	Устанавливает выравнивание элемента по подстрочной линии родительского блока.
`super`	Устанавливает выравнивание элемента по надстрочной линии родительского блока.
`top`	Устанавливает выравнивание элемента по верхней линии родительского блока.
`text-top`	Устанавливает выравнивание элемента по верхней линии шрифта родительского блока.
`middle`	Устанавливает выравнивание элемента на половину высоты родительского блока.
`bottom`	Устанавливает выравнивание элемента по нижней линии родительского блока.
`text-bottom`	Устанавливает выравнивание элемента по нижней линии шрифта родительского блока.
length	Значение может быть указано в `px`, `pt`, `cm`, `em` и т. д. Числовое значение увеличивает или уменьшает поле на это расстояние от базовой линии его родителя. Значение `0px` совпадает с `baseline`.
percentage	Числовое значение увеличивает или уменьшает поле на расстояние, вычисленное процентного соотношения элемента `line-height`. Значение 0% совпадает с `baseline`.
`initial`	Устанавливает это свойство в значение по умолчанию.
`inherit`	Если указан, связанный элемент принимает вычисленное значение своего родительского элемента `vertical-align`.