Задать вопрос
@skuvaWeb
css

Горизонтальный скролл при использовании grid?

Начал учить гриды, вроде бы сделал элементарную сетку, но почему-то появляется горизонтальный скролл. Гугл не помог) Был бы благодарен за объяснение такого странного поведения
Codepen
  • Вопрос задан
  • 804 просмотра
Комментировать
Подписаться 2 Простой Комментировать
Решения вопроса 1
monochromer
@monochromer
DIVeloper
При процентном задании размеры рассчитываются без учета gap, поэтому лучше использовать fr-единицы
grid-template-columns: repeat(4, 1fr);
Ответ написан
Комментировать
Комментировать
Пригласить эксперта
Ответы на вопрос 1
LenovoId
@LenovoId
svg, css,js
Вы применяете статические величины а надо применять фракцию т.е : 1fr и указать в grid-template-columns: 1fr 1fr 1fr 1fr;

https://codepen.io/topicstarter/pen/vvdVWG я гриды не учил .... но примерно так

И кстати - отличное пособие по grid : уроки
Ответ написан
3 комментария
3 комментария
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
Вакансии с Хабр Карьеры
Frontend-разработчик (React)
ДАЛЕЕ
от 130 000 ₽
JavaScript разработчик
вАйТи
от 5 000 до 25 000 ₽
Frontend React
Glob-com
от 100 000 ₽
Ещё вакансии
Заказы с Хабр Фриланса
Доработать клиентское приложение для GTA 5 на C#
20 апр. 2024, в 00:51
1000 руб./за проект
Верстка и логика формы выбора билетов в зале для покупки
20 апр. 2024, в 00:43
10000 руб./за проект
Разработать формирование УПД на Java
20 апр. 2024, в 00:28
20000 руб./за проект
Ещё заказы