如何使同一行的物品具有相同的高度?

时间:2017-12-17 14:06:25

标签: jquery html css zurb-foundation

我正在使用Foundation-zurb在我的页面上列出文章列表。但是如果某篇文章有大名或描述它会对网格产生影响并将下一级网格移动到混乱状态。

<div class="row">
<div class="small-12 medium-12 large-12 columns">

        {% for article in articeone %}

            <div class="small-12 medium-6 large-6 columns nothing_article end">

            ....

            </div>

        {% endfor %}

</div>

enter image description here

所以我需要同一级别的所有项目都占据biggers项目的高位。像这样:

enter image description here

所以,也许某些js-library的技巧可以帮助我做到这一点。

1 个答案:

答案 0 :(得分:1)

将自定义类(即.myClass)添加到.row并使用此功能:

.row.myClass {
  display: flex;
  flex-wrap: wrap;
}

请记住prefix所有CSS,以获得最大的浏览器兼容性。