Как подогнать grid для маленьких экранов?

Question

[shemshen]

Сверстано гридами. При уменьшении экрана в консоли до 200 пикселей по ширине грид занимает только полэкрана. При еще большем уменьшении может занимать треть или даже четверть экрана. Попробовала убрать картинку-подложку и оставить только цвет в бэкграунде - все равно занимает только часть экрана.

Comments

[Danny Arty]

скиньте либо код, либо ссылку на страницу. да и какой смысл рассматривать настолько маленькую ширину экрана?

[Сергей delphinpro]

Попробовала убрать картинку-подложку и оставить только цвет в бэкграунде - все равно занимает только часть экрана.

Это класс! Прямо пять баллов ! =))

[Евгений]

Сергей delphinpro, Стоит навороченный мерс. Не заводится. Новый вышел из мерса, протер тряпочкой фары, все равно не заводится Снова вышел, постучал ногой по шинам - не заводится.
Сел на капот, сидит. Подъезжает другой навороченный мерс. Из него выходит другой новый русский.
2НР:- Че, не заводится?
1НР:- Ага
2НР:- А ты фары вот так тряпочкой протирал?
1НР:- Ага
2НР:- А ты по шинам вот так стучал?
1НР:- Ага
2НР:- Ну тогда не знаю!!

[shemshen]

Danny Arty, код длинный, ссылка:

текст идет в строке grid-template-areas
высота строки 1fr
ширина столбцов grid-template-columns: 39px 0.4fr 2fr 1fr;

Заинтересовало, как это может выглядеть на экранах маленьких телефонов. Вместо текста на весь экран показывает текст только на половину экрана.

Сергей delphinpro, я сначала подумала, что дело в параметрах картинки.

[Danny Arty]

shemshen, вы неправильно вставили ссылку

[Danny Arty]

shemshen, все равно не вижу ссылку и полный css. Закиньте хотя бы код в песочницу, или думаете его туи по картинке угадывают?

Заинтересовало, как это может выглядеть на экранах маленьких телефонов.

Ну дык смотрите до 320, зачем вам 200 и меньше?

[Ankhena]

shemshen,

ширина столбцов grid-template-columns: 39px 0.4fr 2fr 1fr;

Подумайте о том, что на мобилках должно быть не 4 столбца, а 1