CSS Grid как сделать сетку?

Question

[Иван Плотников]

koronanews.usite.pro
Как сделать, чтобы в гриде первые 9 областей были как сейчас, с минимальной высотой 250px, а 10-12 - с минимальной высотой 30px?

Answer 1

[Андрей Федоров]

<div class="wrapper">
  <div class="item"></div>
  ...
  <div class="item"></div>
</div>

Без гридов:

.item {
  min-height: 250px;
}
.item:nth-child(n+10) {
  min-height: 30px;
}

На гридах:

.wrapper {
   display: grid;
   grid-template-columns: repeat(3, 1fr);
   grid-template-rows: repeat(3, minmax(250px, auto)) minmax(30px, auto);
}

Comments

[Иван Плотников]

Нет, нужно именно через CSS Grid

[Андрей Федоров]

the_lord_of_the_king, лол. дз по информатике? )))

[Иван Плотников]

Нет, делаю онлайн-журнал и для этой задачи мне нужно именно такое решение

[Андрей Федоров]

the_lord_of_the_king, обновил