два столбца, оба столбца одинаковой высоты И оба заполняют всю высоту экрана

Question

У меня есть необходимость в расположении двух столбцов, где оба столбца должны быть одинаковой высоты И, если содержимое ни одного из div не является достаточно высокий, то обе колонки должны растянуться до нижней части страницы.

Я использую javascript для выравнивания высот и убедитесь, что они растягиваются до нижней части страницы, и это работает отлично, но я также использую ajax для создания маленькой таблицы, которую я вставляю. Это приводит к растягиванию содержимого и, следовательно, означает, что div, который я дал высоте, больше не растягивается и т. Д. Я думаю, я мог бы использовать больше javascript, чтобы добавить больше высоты в зависимости от того, насколько высок мой стол, но там быть более простым способом.

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

Каков наилучший способ для этого?

для удовольствия вот мой JS

// Equalise the heights of the two main columns and body 
var $toEqualize = $('.equalheightbox'); 
var wS = $(window).height(); 
$toEqualize.css('height', (function(){ 
    return Math.max.apply(null, $toEqualize.map(function(){ 
     var addALittle = $(this).height() + 50; 
     $('body').css('height', (wS > addALittle ? wS : addALittle)); 
     return wS > addALittle ? wS : addALittle; 
    }).get()); 
})); 

Answer 1

Вы думали о настройке высоты до 100% через CSS?

http://jsfiddle.net/ahCs7/

html,body { height:100%;} 
.column { width:50%; height:100%; float:left;}