css grid. Расположение внутри контейнера
Ответы (1 шт):
Автор решения: soledar10
→ Ссылка
Пример, используем viewport units - vh
* {
padding: 0;
margin: 0;
box-sizing: border-box;
}
.grid {
display: grid;
height: 100vh;
}
.grid__item {
border: 1px solid #00f;
padding: 1rem;
}
.grid__item:nth-child(1) {
grid-column: 1 / 4;
grid-row: 1 / 3;
}
.grid__item:nth-child(2) {
grid-column: 4 / 6;
grid-row: 1 / 2;
}
.grid__item:nth-child(3) {
grid-column: 4 / 6;
grid-row: 2 / 3;
}
<div class="grid">
<div class="grid__item">1</div>
<div class="grid__item">2</div>
<div class="grid__item">3</div>
</div>
