Свойство position определяет порядок, в соответствии с которым элемент отображается на веб-странице. По умолчанию элементы отображаются последовательно один за другим в том порядке, в котором они определены в документе.

Блочные элементы, такие как p, div, table, blockquote и др. отображаются в виде прямоугольника, который занимает 100% ширины родительского элемента. Поэтому последовательные блочные элементы отображаются один под другим.

Инлайновые элементы, такие как em, strong, span, q, abbr и т.п., отображаются в виде прямоугольника, ширина которого соответствует ширине данных внутри него. Поэтому инлайновый элементы отображаются рядом друг с другом, либо рядом с текстом.
Свойство position вместе с top, right, bottom и left свойствами может отображать элемент с нарушением обычного порядка.

Возможные значения

static
Элементы отображаются последовательно один за другим в том порядке, в котором они определены в документе
relative
Позиция элемента смещается относительно его исходного положения вверх, вниз, вправо или влево (зависит от того, какое свойство применено: top, right, bottom или left).
absolute
Позиция элемента смещается относительно родительского элемента вверх, вниз, вправо или влево (зависит от того, какое свойство применено: top, right, bottom или left), а так же нарушается порядок отображения элементов. Элементы, следующие за ним располагаются так, словно его нет на странице.
fixed
Расположение элемента нарушает обычный порядок так же, как при значении absolute, но его позиция зафиксирована относительно границы окна браузера и поэтому элемент не прокручивается вместе с остальным контентом страницы. Позиция элемента смещается вверх, вниз, вправо или влево (зависит от того, какое свойство применено: top, right, bottom или left)
inherit
Заимствует значение у родительского элемента.

Характеристики

Значение по умолчанию: static

Применяется: Ко всем элементам

Наследуется: Нет

См. также
top
right
bottom
left