Проблема высоты строки CSS-GRID - PullRequest
0 голосов
/ 04 января 2019

Мне тяжело с высотой строки css-grid.

Это то, что у меня сейчас есть: Текущий результат

То, что я хочу, это результат ниже, где 1 и 2 - одинаковые высоты.

Результат, которого я хочу достичь

Можно ли указать высоту строки без жестко заданного значения, например height: 500px

Но вместо жестко закодированных значений использовать дроби или что-то еще?

Это код, который у меня есть для моей сетки (предметов)

.o-grid {
  display: grid;
  grid-gap: 20px;
  grid-template-columns: repeat(4, 1fr);
  grid-template-rows: 0.5fr 2fr 1fr 1fr 2fr;
  height: 100%;

  &__header {
    grid-column: 1/5;
    grid-row: 1;
  }

  &__statistics {
    grid-column: 1;
    grid-row: 2;
  }

  &__burndown {
    grid-column: 2 / span 2;
    grid-row: 2 / 5;
  }

  &__fastlane {
    grid-column: 4 / 5;
    grid-row: 2 / -1;
    margin: -20px 0 0 0;
  }

  &__today {
    grid-column: 1;
    grid-row: 3;
  }

  &__beer {
    grid-column: 1;
    grid-row: 4;
  }
}

Заранее спасибо!

...