Выравнивание элементов в колонках по высоте

Делал я тут один интернет-магазин. Дизайн, верстка, кодинг… В общем — полный пакет. Для облегчения верстки использовал Bootstrap 3. И застрял я на одном неприятном моменте — на витрине магазина. Витрина по просьбе заказчика версталась в виде сетки из 3 столбцов (по умолчанию для экранов больше 900px по ширине). В каждом столбце — плашка продукта с кратким описанием, названием, ценой, указанием количества для покупки и кнопка добавления в корзину.Всё бы ничего, но вот краткое описание или слишком длинное название продукта делало эти плашки разными по высоте.

И это периодически ломало стройные ряды витрины. Получалось как-то так:

Так дело не пойдет, понял я и отправился серфить просторы на предмет решения. Готового решения для Bootstrap я так и не обнаружил, зато узнал что с версткой колонками и их выравниванием по высоте — дела обстоят хреново. Примерно так же хреново, как раньше было дело со скруглением уголков у прямоугольных элементов.

Однако JavaScript приходит спасителем и несет добро во имя луны. Небольшой код в дополнение к имеющемуся JQuery помог выровнять плашки по высоте в каждой строке.

$(document).ready(function(){
    $.fn.equivalent = function (){
        var $blocks = $(this),
        maxH    = $blocks.eq(0).height(); 
        $blocks.each(function(){
            maxH = ( $(this).height() > maxH ) ? $(this).height() : maxH;
        });
        $blocks.height(maxH); 
    };
    $(".shop_item").equivalent(); 
});

В принципе, тут всё просто. Код ищет элементы с указанным классом shop_item, потом ищет самый высокий и далее меняет размер у всех остальных элементов на максимальный.

Получилось вот так:

Ну я и успокоился на этом. Однако спустя пару дней заказчик посетовал что в Chrome верстка вообще сдыхает при первой загрузке страницы. После перезагрузки или при повторном открытии всё хорошо. Javascript срабатывал коряво :( Получалось как-то вот так:

Это уже совсем никуда не годилось. Мало того что выглядит неприглядно, так еще и функционал нарушается. И я завис с решением. Периодами было желание плюнуть на адаптивность и заверстать витрину в обычную таблицу. Но вскоре решение было найдено. Как оказалось не правильно срабатывал скрипт только в Chrome, даже IE9 и тот верно отрабатывал и показывал всё как положено. А решение оказалось простым. Надо было вешать функцию не на событие готовности страницы, а на загрузку окна. После редактирования скрипт стал выглядеть вот так:

$(window).load(function(){
$.fn.equivalent = function (){
var $blocks = $(this),
maxH    = $blocks.eq(0).height();
$blocks.each(function(){
maxH = ( $(this).height() > maxH ) ? $(this).height() : maxH;
});
$blocks.height(maxH);
};
$(".shop_item").equivalent();
});

Ну и, в общем, не зря я хром недолюбливаю. Кажется лавры ишака не дают ему спокойно спать и он всё больше пытается тянуть на себя одеяло. Ресурсы так вообще жрет как не в себя :)