@Ted не уверен, что вы можете объединить 3 ограничения внутри grid-template-column, но да, подождите, возможно, есть какой-то магический трюк с Grid;)
ли способ,без использования медиа-запроса, чтобы ограничить количество создаваемых столбцов и объединить это с автоподгонкой / заполнением?
Например:
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
Создает замечательный, отзывчивый макет. Но представьте, дизайн требует максимум 3 столбцов - даже в широких браузерах. Было бы радостно показать, 4, 5, больше столбцов, насколько позволяет пространство.
Используя медиа-запрос, я могу указать большие экраны:
grid-template-columns: 1fr 1fr 1fr;
И меньшие экраны получают:
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
Но это неправильно. Есть ли способ сказать моему макету сетки повторяться максимум до n раз, и при этом использовать повтор и авто-подбор / заполнение?
Обновление: это не дубликат:Как ограничить количество столбцов в больших окнах просмотра с помощью CSS Grid и автозаполнения / подгонки?
Я спрашиваю, как заставить код для области просмотра также работать для меньших областей просмотра. Упомянутый выше вопрос (и ответ) только подходит к исходной точке моего вопроса.