Я создал простую сетку для своего веб-сайта блога, где я хотел, чтобы все поля или элементы div, кроме первого, можно было прокручивать по горизонтали на маленьком экране (я имею в виду 780 пикселей). Как мне это сделать...? Я пробовал много способов, но не смог.
Чего я хочу:
Теперь у меня есть:

Вот что я хочу на маленьком экране:

Вот мой код:
.parent { дисплей: сетка; столбцы-шаблона сетки: повторение (3, 1fr); строки-шаблона сетки: повторение (3, 1fr); сетка-столбец-зазор: 0 пикселей; разрыв строки сетки: 0 пикселей; } .div { отступ: 35 пикселей; фон: Доджерблю; поле: 5 пикселей; выравнивание текста: по центру; цвет: #fff; } .parent .div:nth-child(1) { площадь сетки: 1/1/3/3; } .parent .div:nth-child(2) { площадь сетки: 1/3/2/4; } .parent .div:nth-child(3) { площадь сетки: 2/3/3/4; } .parent .div:nth-child(4) { площадь сетки: 3/3/4/4; } .parent .div:nth-child(5) { площадь сетки: 3/2/4/3; } .parent .div:nth-child(6) { площадь сетки: 3/1/4/2; 1 2 3 4 5 6
Пожалуйста, помогите мне.
Мобильная версия