Полное описание примера, иллюстрирующего абсолютное позиционирование

Диаграмма показывает действие абсолютного позиционирования бокса.

Изображено окно документа с 8 строками (пронумерованными от 1 до 8), каждая высотой 24px. Весь текст вне бокса "outer" расположен в строках 1 и 2.

Бокс "outer" позиционирован абсолютно и занимает нижнюю правую четверть окна документа. Весь текст в "outer" и его потомках занимает вторую половину строк с 5 по 8.

В следующем элементе PRE каждая строка в 24 пикселов симулируется двумя строками, имеющими соответствующий номер. Строки, как они выведены в изображении, содержат:

1 Beginning of body contents. End of

2 body contents.

3

4

5                Start of outer

6                contents. Inner

7                contents. End of

8                outer contents.

По умолчанию цвет текста - чёрный. "Start of outer contents" -красный. "Inner contents" - голубой. "End of outer contents" - красный.

Вернуться к изображению.