Инструкции
Помните, что в CSS этих макетов много комментариев. Если большинство операций выполняется в представлении Дизайн то имеет смысл посмотреть на код. Там есть советы по использованию CSS при работе с плавающими макетами. Перед запуском сайта комментарии можно удалить. Чтобы узнать больше о техниках используемых в этих макетах CSS прочтите следующую статью в Центре разработки Adobe: http://www.adobe.com/go/adc_css_layouts.
Метод очистки
Поскольку все столбцы обтекаемые, в этом макете в правиле .footer используется объявление clear:both. Эта техника очистки заставляет .container видеть места окончания столбцов, чтобы показать все границы или фоновые цвета, помещенные в .container. Если требуется удалить .footer из .container, то понадобится другой метод очистки. Надежнее всего будет добавить <br class="clearfloat" /> or <div class="clearfloat"></div> после последнего обтекаемого столбца (но до закрытия .container). Эффект очистки будет аналогичным.
Вставка логотипа
В этом макете установлен заполнитель рисунка — в .header, где, скорее всего, будет размещен логотип. Рекомендуется удалить заполнитель и заменить его своим логотипом со ссылкой.
Помните, что при использовании инспектора свойств для перехода к своему логотипу при помощи поля SRC (вместо удаления и замены заполнителя) следует удалить встроенный фон и свойства экрана. Эти встроенные стили предназначены только для того, чтобы отображать заполнитель в браузере.
Чтобы удалить встроенные стили, убедитесь, что для панели "Стили CSS" установлено значение "Текущий". Выберите изображение и в области "Свойства" на панели "Стили CSS" щелкните правой кнопкой мыши и удалите свойства экрана и фона. (Также всегда можно перейти прямо в код и удалить встроенные стили из изображения или заполнителя в коде.)
Условные комментарии в Internet Explorer
Эти плавающие макеты содержат условный комментарий Internet Explorer (IECC), позволяющий решить две проблемы.
- Браузеры по-разному округляют размеры DIV в макетах на процентной основе. Когда нужно отобразить такую величину, как 144,5 пиксела или 564,5 пиксела, браузер должен округлить ее до ближайшего целого значения. Браузеры Safari и Opera округляют вниз, Internet Explorer — вверх, а Firefox — один столбец вверх и один вниз, полностью заполняя контейнер. Проблема округления может привести к несогласованности в некоторых макетах. В IECC есть отрицательное поле в 1 пиксел для исправления IE. Его можно перенести к любому столбцу (слева или справа) так, как это нужно для макета.
- Свойство масштабирования добавлено к привязке в списке навигации, поскольку в некоторых случаях в IE6 и IE7 отображается лишнее пустое место. Благодаря масштабированию IE получает свойство hasLayout для исправления этой проблемы.