Заставить контейнер сетки CSS заполнить весь экран устройстваCSS

Разбираемся в CSS
Ответить
Anonymous
 Заставить контейнер сетки CSS заполнить весь экран устройства

Сообщение Anonymous »

Как заставить контейнер CSS-сетки занимать всю ширину и высоту экрана устройства для одностраничного приложения? Измененный пример взят из Mozilla: документация Firefox

Код: Выделить всё

.wrapper {
display: grid;
border-style: solid;
border-color: red;
grid-template-columns: repeat(3, 1fr);
grid-template-rows: repeat(3, 1fr);
grid-gap: 10px;
}
.one {
border-style: solid;
border-color: blue;
grid-column: 1 / 3;
grid-row: 1;
}
.two {
border-style: solid;
border-color: yellow;
grid-column: 2 / 4;
grid-row: 1 / 3;
}
.three {
border-style: solid;
border-color: violet;
grid-row: 2 / 5;
grid-column: 1;
}
.four {
border-style: solid;
border-color: aqua;
grid-column: 3;
grid-row: 3;
}
.five {
border-style: solid;
border-color: green;
grid-column: 2;
grid-row: 4;
}
.six {
border-style: solid;
border-color: purple;
grid-column: 3;
grid-row: 4;
}

Код: Выделить всё


One
Two
Three
Four
Five
Six



Я не знаю, что делать, чтобы этот код работал.

Подробнее здесь: https://stackoverflow.com/questions/437 ... -of-device
Ответить

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

Вернуться в «CSS»