position

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

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

Значения

absolute - указывает, что элемент абсолютно позиционирован, при этом другие элементы отображаются на веб-странице словно абсолютно позиционированного элемента нет вообще. Положение элемента задается свойствами left, top, right и bottom, также на положение влияет значение свойства position родительского элемента. Так, если у родителя значение position установлено как static или родителя нет, то отсчет координат ведется от края окна браузера. Если у родителя значение position задано как fixed, relative или absolute, то отсчет координат ведется от края родительского элемента.
fixed - по своему действию это значение близко к absolute, но в отличие от него привязывается к указанной свойствами left, top, right и bottom точке на экране и не меняет своего положения при прокрутке страницы. Браузер Firefox вообще не отображает полосы прокрутки, если положение элемента задано фиксированным, и оно не помещается целиком в окне браузера. В браузере Opera хотя и показываются полосы прокрутки, но они никак не влияют на позицию элемента.
relative - положение элемента устанавливается относительно его исходного места. Добавление свойств left, top, right и bottom изменяет позицию элемента и сдвигает его в ту или иную сторону от первоначального расположения.
static - элементы отображаются как обычно. Использование свойств left, top, right и bottom не приводит к каким-либо результатам.

inherit - наследует значение свойства родительского элемента.

Пример использования

{
    position: relative;
    background: #f0f0f0;
    height: 200px;
   }

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

1. Применяется ко всем элементам, за исключением генерируемых.
2. Значение по умолчанию: static
3. Наследуется.

Синтаксис

position: absolute | fixed | relative | static | inherit

Версии CSS

CSS 2
CSS 2.1
CSS 3

Нашли ошибку, опечатку, неточность, неактуальную или устаревшую информацию? Пишите.