css position
Свойство 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- Заимствует значение у родительского элемента.