Вертикальное растягивание

Задача усложняется тем, что в CSS блок растягивается ровно на столько, сколько требуется, чтобы вместить все содержимое (если высота не задана явно), например, если блок содержит изображение высотой 200px, то его высота будет равна тем же 200px.

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

Весь секрет заключается в использовании, повторяющегося по вертикали фонового изображения для создания иллюзии колонок с разным фоном. Для SimpleBits, я сделал изображение с декоративными полосками по краям, коричневой правой колонкой и широкой полоской белого цвета для области контента.