Очистка столбцов сетки загрузки

Question

Мне сложно понять структуру clearfix столбца в бутстрапе. Я пытаюсь создать макет карты, для которой строки в макете должны быть одинаковой высоты, но содержимое каждой записи не обязательно одинаково. Вы можете увидеть пример того, что я делаю здесь: https://demo.eap.soa.com/content/test/staticapps.html

Часть трудность заключается в том, что я использую шаблон Рули для получения контента:

<script id="Handlebars-Template" type="text/x-handlebars-template"> 
<div class="row"> 
    {{#each apps}} 
    <div class="col-md-4"> 
    <h4>{{title}}</h4> 
    <p>{{description}}</p> 
    </div> 
    {{/each}} 
</div> 
</script> 

Так что это не просто вставить пустую очистку div каждые X записей или даже обязательно знать, что X должен быть.

Я могу взломать его, используя минимальную высоту на классе col-md-4, но это кажется довольно уродливым.

Любые идеи здесь?

Спасибо.

Answer 1

Я не знаю, может ли этот ответ помочь вам.

Ваш контент div уже меняется, как вы сказали, поэтому способ будет задавать javascript, когда документ готов.

Просто нужно проверить максимальную высоту каждого целевого div и применить его к каждому div.

Вот это своего рода код в действии: http://bootply.com/103561

Только что, мне очень жаль, потому что, когда я писал код, я был в облаках, а вар mini не младшее, он должен быть назван " maxi»...

И этот же код в Visu:

$(document).ready( makeDivSimilar ); 

function makeDivSimilar() 
{ 
    var mini = 0; 
    $('.col-md-4').each(function(){ 
     if(parseInt($(this).css('height')) > mini) 
     { 
     mini = parseInt($(this).css('height')); 
     } 
    }); 
    $('.col-md-4').css('height',mini); 
}