Мне тяжело с высотой строки 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;
}
}
Заранее спасибо!