Абсолютные координаты
При использовании "абсолютных" координат точка отсчета помещается в верхний левый угол окна браузера, а оси X и Y направлены вправо по горизонтали и вниз по вертикали, соответственно:
Если в этой системе координат некоторый блочный элемент должен быть размещен на 10px ниже верхнего обреза рабочей области браузера и на 20px правее правого края рабочей области браузера, то его описание будет выглядеть следующим образом:
.example {position:absolute;top:10px;left:20px;}
[Открыть окно примера]
В данной записи тип системы координат задан атрибутом position (значение - absolute), координата X задана атрибутом left (значение - 20px), координата Y задана атрибутом top (значение - 10px).
Атрибуты top и left определяют координаты верхнего левого угла блока в абсолютной системе координат.
Значения координат могут быть и отрицательными. Для того, чтобы убрать из отображаемой области блок с линейными размерами 100px (высота) на 200px(ширина) достаточно отпозиционировать его следующим образом:
.example {position:absolute;
top:-100px;left:-200px;
width:200px;height:100px;}
[Открыть окно примера]
Абсолютное позиционирование применяется тогда, когда либо все содержание страницы должно быть доступно без скроллинга ("прокрутки"), либо когда элементы разметки находятся в начале страницы и их взаимное размещение важно с точки зрения дизайна, например, для организации всплывающих меню.
