Инструкции

Помните, что в CSS этих макетов много комментариев. Если большинство операций выполняется в представлении Дизайн то имеет смысл посмотреть на код. Там есть советы по использованию CSS при работе с фиксированными макетами. Перед запуском сайта комментарии можно удалить. Чтобы узнать больше о техниках используемых в этих макетах CSS прочтите следующую статью в Центре разработки Adobe: http://www.adobe.com/go/adc_css_layouts

Очистка

Поскольку все столбцы обтекаемые, в этом макете используется overflow:hidden в .container. Такая техника очистки заставляет .container видеть места окончания столбцов, чтобы показать все границы или фоновые цвета, помещенные в .container. При наличии крупного элемента, выдающегося за пределы .container, он будет выглядеть обрезанным. Вы также не сможете использовать отрицательные поля или абсолютное позиционирование с отрицательными значениями, чтобы извлекать элементы вне .container, или они также не будут отображаться вне .container.

Если эти свойства нужны в работе, то потребуется другой метод очистки. Надежнее всего будет добавить <br class="clearfloat" /> or <div class="clearfloat"></div> после последнего обтекаемого столбца (но до закрытия .container). Эффект очистки будет аналогичным.

Нижний колонтитул

Добавление нижнего колонтитула после столбцов, но все равно внутри .container приведет к ошибке этого метода очистки overflow:hidden. Можно поместить .footer во второй .container вне первого без каких-либо нежелательных эффектов. Возможно, проще всего будет начать с макета, содержащего верхние и нижние колонтитулы, и удалить верхний колонтитул, чтобы использовать методы очистки для этого типа макетов.

Фоны

По своей сути фоновый цвет отображается в любом DIV только по длине содержимого. Это значит, что если фоновый цвет или граница используется для создания образа бокового столбца, то они распространяются не до нижнего колонтитула, а только до того места, где кончается содержимое. Если DIV .content должен содержать больше информации, можно поместить в нем границу, чтобы отделить его от столбца.