Макеты практически на все случаи жизни с сайта trifler.ru

Особенности

• Область контента - наиболее интересная часть сайта, идет по html-коду раньше всего, а header и горизонтальное меню по html-коду находятся в самом конце страницы.
• Колонки равной высоты.
• Все макеты имеют 100% высоту.

Иллюзия одинаковой высоты колонок центральной части достигается за счет использования стилевых правил для колонок центральной части:

  margin-bottom:-32767px;padding-bottom:32766px;

а для основного контейнера центральной части шаблона:

  overflow:hidden;

К сожалению, их использование имеет один существенный недостаток - перемещение по web-странице с помощью меток-якорей невозможно или работает некорректно. Как это обойти, описано в статье: "Абсолютное позиционирование и колонки равной высоты".

Просмотреть/скачать макеты trifler.ru

Трехколоночная разметка

Left Content Right

• • lcr_shablon_01
  • lcr_shablon_02
  • lcr_shablon_03
  • lcr_shablon_04
  • lcr_shablon_05
  • lcr_shablon_06
  • lcr_shablon_07

Content Left Right

• • clr_shablon_01
  • clr_shablon_02
  • clr_shablon_03
  • clr_shablon_04
  • clr_shablon_04a

Left Right Content

• lrc_shablon_01
• lrc_shablon_02
• lrc_shablon_03
• lrc_shablon_04
• lrc_shablon_04a

Двухколоночная разметка

Content Right

• • cr_shablon_01
  • cr_shablon_02
  • cr_shablon_03

Left Content

• lc_shablon_01
• lc_shablon_02
• lc_shablon_03

Скриншоты и файлы некоторых шаблонов

Файлы на случай недоступности сайта trifler.ru:

Контент - левая - правая
clr_01
clr_02
clr_03
clr_04
clr_04a
Контент - правая
cr_03 - 2 колонки
Левая - контент - правая
lcr_04
lcr_05
lcr_06
lcr_07
Левая - правая - контент
lrc_02