Динамическая подгонка блоков javascript

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

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

Если мы группируем по строкам блоки с товарами (отмечены голубыми квадратами), то возникает новая проблема - если наполнение в блоках разное, то они будут "плясать", т.е. один блок больше, второй меньше, третий еще меньше.

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

Допустим у нас у голубых блоков класс .blue, а у оранжевых .orange


Пишем такой скрипт:

$(window).load(function()

{

   $(".blue").css('height', function(){return $(this).parent().height()-10; });

})

Где 10 - разница высоты голубого блока и оранжевого, эта разница считается по верхним и нижним padding и margin в соответствующих блоках, можно дописать скрипт, чтобы он сам узнавал эти параметры, но если стили страницы неизменны, то зачем лишние операции на стороне браузера?