将行平均分为 3 列

Question

我正在使用 mattable，假设我有 26 条记录，那么我需要在 Column1 中显示前 10 条记录，在第 2 列中显示接下来的 10 条记录，在第 3 列中显示接下来的 6 条记录。他们有什么方法可以实现这一点CSS ?

Answer 1

使用display flex

html

<div class="main-row">
   <div class="col">
   </div>
    <div class="col">
   </div>
    <div class="col">
   </div>
</div>

css

.main-row{
  display:flex;
}

.col{
  flex-grow:1;
  height:150px;
  background-color:#e5e5e5;
  margin:0px 2px;
}

Answer 2

我找到了使用 CSS GRID 的解决方案。在下方发布 link：

Divide the rows equally into 3 columns