Bootstrap网格列清除

我很难理解 Bootstrap 中的列 ClearFix 结构。我正在尝试创建一个卡片布局，它需要布局中的行都具有相同的高度，但每个条目中的内容不一定相同。您可以在这里查看我正在做的事情的示例：https://demo.eap.soa.com/content/test/staticapps.html 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>

因此，每 X 个条目插入一个空的清除 div 并不容易，甚至不一定要知道 X 应该是什么。

我可以通过在 col-md-4 类上使用 min-height 来破解它，但这看起来很丑陋。

这里有什么想法吗？

Thanks.

不知道这个回答能不能帮到你。

正如您所说，您的 div 内容已经发生变化，因此一种方法是在文档准备好时询问 javascript。

只需检查每个目标 div 的最大高度，并将其应用于每个 div 即可。

这是一种正在运行的代码：http://bootply.com/103561 http://bootply.com/103561

只是，我很抱歉，因为当我写代码时，我云里雾里，varmini没有意义，应该命名为 '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);  
}