Можно ли как то заполнить пустое пространство первым блоком?

Question

[godsplane]

https://codepen.io/poylar/pen/oNzJXKK
Собственно я не понимаю почему первый блок не становиться на второй ряд

Answer 1

[Вадим]

.item:first-child {
    grid-row-start: 1;
    grid-row-end: 2; // А у вас 3. Если первый элемент занимает 2 строки, то как третьему элементу занять его место? А высоту Вы зафиксировали.
    grid-column-start: 1;
    grid-column-end: 3;
}

Comments

[godsplane]

Я экспериментировал с разными значениями, но мне нужно чтобы пустое пространство заполнил именно первый блок а не другие к нему подтянулись.

[Вадим]

godsplane, Какой Вы считаете первым?

[godsplane]

Вадим, ну который первый в верстке очевидно.
Если не понятно то конечная цель это что то такое

[Вадим]

godsplane, Ну так Вы же высоту элементам ограничили(о чём я написал в ответе в самом конце комментария). Как элемент растянется на 400px, если вы задали 200? Отсюда и пустота. По сетке он на 2 строки, а по высоте на одну.

[godsplane]

Вадим, понял, принял,спасибо

Answer 2

[WapSter]

Ну так ты ему высоту задал 20vh вот по этому он и не встает.