Абсолютное позиционирование и колонки равной высоты

Trifler Blog

Абсолютное позиционирование и колонки равной высоты

В любой сфере деятельности, а будем говорить применительно к web-верстке, встречаются побочные эффекты. Собственно, в этом нет ничего необычного. Все в основном сводится к правке косяков и кривостей в тех или иных браузерах.

Другое дело, что иногда, минусы побочных эффектов можно обратить и в свою пользу, даже отказавшись от устоявшихся, укоренившихся подходов к решению тех или иных проблем.

Очень часто верстальщики, как начинающие, так и профессионалы для создания иллюзии одинаковой высоты колонок центральной части макета используют стилевые правила:

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

Побочные эффекты разметки на их основе давно известны:

  • Не удачное сочетание стилей может привести к появлению бесконечной вертикальной прокрутке web-страницы
  • Отсутствие нижнего border’a у колонок
  • Не корректная работа меток-якорей

Если два первых пункта при грамотной реализации и не больших издержках в виде лишних контейнеров для прорисовки нижнего border’a не являются непреодолимыми, то проблема работы меток-якорей решения на сегодняшний день не имеет.

Предлагаемая вам разметка практически полностью лишена перечисленных недостатков, за исключением дополнительных блоков.

Чисто технические сложности при переходе от фиксированного макета к полу-резине или полностью резиновому шаблону, связанные с абсолютным позиционированием и процентными величинами, чуть все усложняет в таблице стилей, не более того.

Пример

Комментарии к этой заметке больше не принимаются.


Рейтинг популярности - на эти заметки чаще всего ссылаются:

banner counters.php

leftcounters
width:160px;
height:160px;

banner counters.php

centercounters
width:160px;
height:160px;

banner counters.php

rightcounters
width:160px;
height:160px;

Горизонтальный banner counters.php - width:494px;

декабрь, 2009
пн вт ср чт пт сб вс
  1 2 3 4 5 6
7 8 9 10 11 12 13
14 15 16 17 18 19 20
21 22 23 24 25 26 27
28 29 30 31      
free  counters