Рис. 12.19 видно, что НТМL-код для раздела mai n, где находится главное содержимое
Страницы, появляется перед НТМL-кодом либо Для левого бокового меню
С ID, равным mai nNav, либо для правого бокового меню с ID, равным news. Несколько
Факторов делают этот дизайн отличным от базовой разметки с плавающими
Элементами, которую вы создавали в предыдущем уроке. Поскольку НТМL-код
Для главного раздела ( ma i n) идет первым, вы должны сделать его плавающим, чтобы
Боковые меню обтекали его с любой стороны. Раздел ma i n на веб-странице должен
Располагаться посередине, между двумя боковыми меню. Обычно такое расположение
Невозможно. Но мы будем с умом использовать отрицательные поля
(см. подраздел • Плавающие элементы внутри плавающих элементов>) разд. • Использо~
ание плавающих элементов в разметках>) этой главы), чтобы достичь поставленной
Цели.
1. Добавьте стиль к внутренней таблице стилей для раздела ma i n:
#main {
float: left:
width: 419рх;
padding-left: lOpx;
border-left: lpx dashed #999999:
Пока этот стиль довольно простой. Он размещает раздел в левой части страницы,
Устанавливает его ширину, добавляет левую границу и небольшой промежуток
Между текстом и границей. Затем нужно позиционировать раздел news.
2. Добавьте следующий стиль, чтобы разместить правое боковое меню:
#news {
fl oat: ri ght;
width: lбОрх;
