В свое время мной была опубликована разметка центральной части web-страницы с колонками равной высоты.

Практика использования оной в различных вариациях с расположением колонок навигации относительно области контента, отлично себя зарекомендовала и без каких-либо изменений, перенесена в свежие версии скриптов став основой дефолтного оформления скриптов Мастера Lasto – Lasto Blog и nano-CMS, пользующихся заслуженной популярностью у многочисленной армии его поклонников.

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

В данном случае была предпринята попытка решить проблему 100% высоты предлагаемой разметки, но…

Строка стилевых правил:

  .wrap:after {content:'';clear:both;display:block;}

позволяющая корректно отображать колонки равной высоты в современных браузерах – FireFox, OPERA, Google Chrome и даже в IE7(8), а вот с IE6 нет никаких проблем, препятствует растяжению колонок по высоте.

К плюсам можно отнести вывод области контента по html-коду раньше колонок навигации, плавающую ширину оной, а также правильность работы меток-якорей, что при использовании:

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

не представляется возможным.

Что еще можно сделать слегка по извращавшись :)

В представленном примере все колонки оснащены, индивидуальны цветным border’ом. О том, что для этого необходимо, нет смысла расписывать от и до.

С одноцветной окантовкой все несколько упрощается, пример приводиться не будет, это для любителей по практиковаться в тонкостях html и css.

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

Причин для подобного безобразия вагон и маленькая тележка...

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

В дальнейшем тематика блога останется неизменной, в предпологаемых публикациях больше внимания будет уделено – html5 и css3.

Вот такие не актуальные новости блога Trifler.ru.

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

Также могу предположить, что подобного рода вопрос может возникнуть и из-за того, что визуал скролла в разных браузерах выглядит по разному.

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

Для себя назвал этот прием «методом выталкивания» и в общем случае все выглядит приблизительно так:

html

 <div class="box">
   <div class="scroll">
     ...
   </div>
 </div>

css

.box {
  border:#000 1px solid;float:left;
  margin:20px;overflow:hidden;
  width:260px;height:200px;
}
.scroll {overflow-y:auto;width:278px;height:200px;}

Как видно из стилей ширина контейнеров отличается ровно на ширину скролла, выделено цветом и подбирается при просмотре в зоопарке браузеров.

Демонстрационный пример.

На основе данного метода в различных модификациях выполнена глобальная разметка web-страниц с фиксированными колонками:

• Любителям экзотики и извращений...
• Фиксированные колонки и вертикальная прокрутка
• Фиксированные колонки без position:absolute;

Коллекция примеров к изложенному по последней ссылке.