Другие применения относительного позиционирования

Наиболее распространенное применение относительного позиционирования вообще не включает смещения сгенерированного бокса. Это может звучать странно, почему вы захотите использовать относительное позицонирование без смещения бокса? Причина будет раскрыта в следующей главе, так как она включает абсолютное позиционирование.

Задание position:relative (без смещения бокса) помогает также при некоторых странных ошибках воспроизведения в Internet Explorer. Оно задает имеющее дурную славу внутреннее свойство hasLayout, которое оказывает сильное влияние на то, как Internet Explorer представляет элементы.

Заключение

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

Относительное позиционирование позволяет смещать сгенерированный бокс в одном или двух направлениях. Элемент по прежнему занимает пространство, как если бы он был статическим, но сгенерированный бокс может смещаться в другую позицию. Относительное позиционирование используется в основном совместно с плавающими элементами для создания компоновок, где презентационный порядок отличается от порядка исходного кода.

Контрольные вопросы

• Что произойдет, когда два смежных поля в контексте статического форматирования схлопываются, и одно из полей - или оба - являются отрицательными?

• Добавьте вертикальную границу между каждым из боковых столбцов и столбцом основного контента. Не забудьте, что все три столбца являются плавающими, поэтому высота элемента оболочки схлопывается до нуля.

• Как можно сделать, чтобы все столбцы имели одинаковую высоту (или по крайней мере казались такими), так чтобы фоновые цвета распространялись до нижнего колонтитула, независимо от того, какой столбец длиннее? (Подсказка: найдите "ложные столбцы" с помощью поисковой системы.)

Предыдущая статья - Плавающие элементы и очистка

Следующая статья - Абсолютное и фиксированное позиционирование CSS

Об авторе

Томми Олссон является прагматичным пропагандистом стандартов Web и доступности, который живет в малонаселенной области центральной Швеции. Он написал свой первый документ HTML в 1993 г. и является в настоящее время техническим Web-мастером для правительственного агентства Швеции.

Он написал пока одну книгу - Полный справочник по CSS (совместно с Полем О'Брайеном) - и поддерживает крайне нерегулярно блог с названием Кукушка-аутист (http://www.autisticcuckoo.net/).

15