Как подогнать все блоки под высоту самого высокого Bootstrap

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

1. Оказался не рабочим

   .row {
       display: table;
       div {
           display: table-cell;
       }
   }
   

2. С использованием flex,но bs с ним не дружит, после его использования все блоки встали в ряд и не работает сеточная система.

   .equal, .equal > div[class*='col-'] {
       display: -webkit-box;
       display: -moz-box;
       display: -ms-flexbox;
       display: -webkit-flex;
       display: flex;
       flex:1 0 auto; 
   }
   

3. Реализован на jq. Оказался рабочим но с одним НО. Картинки с блога подгружаются чуть с опозданием и высоту блока jq сначала берет без них, но потом картинки появляются и опускают за пределы блока название и превью поста (тк у блока маленькая высота).

   var highestBox = 0;
   jQuery('.content__block').each(function(){
       if(jQuery(this).height() > highestBox) {
           highestBox = jQuery(this).height(); //нахожу высоту самого высокого блока
       }
   });
   jQuery('.content__block').height(highestBox); //ставлю высоту самого высокого блока всем блокам
   

   На первой картинке jq сработал верно, но такое бывает 1 к 5. На второй проявился баг.

Можно ли как то баг с jq исправить или же есть какой то способ на css?

P.S. у меня один блок с классом .row, и внутри него все блоки с классами .col-*