Question

我一直试图使用数据均衡器来获得一些高度均衡的框，但到目前为止它只应用了一个高度：继承类而不是所需的像素高度。这是我尝试均衡的代码：

＆＃13;

<div class="row" data-equalizer>
  @foreach($category_items as $row)
  <div class="large-3 medium-4 small-12 columns" data-equalizer-watch>
    <div class="small-12 columns">
      <h5>{{{ $row['name'] }}}</h5>
      <p>{{ strip_tags($row['description']) }}</p>
    </div>
    <div class="row padding_left_small" align="left">
      <button>View Range</button>
    </div>
  </div>
  @endforeach
</div>

＆＃13;

foreach循环约12次，＆＃34; name＆＃34;中的数据和＆＃34;描述＆＃34;长度不一。任何帮助，将不胜感激谢谢斯蒂芬

Answer 1

我建议你看看CSS flexboxes。如果你给容器这种风格：

.row-container { 
  display: flex; 
  align-items: stretch; 
}

避免使用.row，因为基础会添加.row:before { content: " ";}与flexbox混淆。您不需要.row：）

所有物品都会拉伸以匹配最高的物品。易于使用flexbox。：）

一些有用的资源：

数据均衡器输出＆＃34;高度：继承＆＃34;

1 个答案:

Guide to flexbox

Play with flexboxes live