Разделите строки поровну на 3 столбца

Question

Я использую mattable, скажем, у меня есть 26 записей, тогда мне нужно показать первые 10 записей в столбце 1, следующие 10 в столбце 2 и следующие 6 в столбце 3. Можно ли как-нибудь добиться этого с помощью CSS?

Answer 1

Я нашел решение, используя CSS GRID. Размещение ссылки ниже:

https://stackblitz.com/edit/angular-mzpbos

Answer 2

использование display flex

HTML

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

1007 * CSS *

.main-row{
  display:flex;
}

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