, чтобы сохранить свой прогресс
Создание гибких макетов с использованием автозаполнения
Функция повтора поставляется с опцией, называемой автозаполнением . Это позволяет автоматически вставлять столько строк или столбцов требуемого размера, сколько возможно, в зависимости от размера контейнера. Вы можете создавать гибкие макеты при объединении auto-fill с minmax . В предварительном просмотре grid-template-columns установлены на
repeat (автозаполнение, minmax (60px, 1fr));Когда контейнер меняет размер, эта настройка сохраняет вставки столбцов 60px и растягивает их до тех пор, пока не сможет вставить другой. Заметка
Если ваш контейнер не может поместить все ваши предметы в одну строку, он переместит их на новый.
В первой сетке используйте auto-fill с repeat чтобы заполнить сетку столбцами, которые имеют минимальную ширину 60px и максимум 1fr . Затем измените размер предварительного просмотра, чтобы увидеть автоматическое заполнение в действии.
/**
* Your test output will go here.
*/