Такая строчка – grid-template-columns: repeat(auto-fill, 100px) – воткнёт столько стопиксельных элементов, сколько влезут в экран, а те, что не влезли, перенесёт на новую строку. Такая строчка – grid-template-columns: repeat(3, minmax(100px, 200px)) – воткнёт три элемента по 200 пикселей, а если уменьшить экран, то элементы будут уменьшатся до 100 пикселей. Но что делает эта строчка – grid-template-columns: repeat(auto-fill, minmax(100px, 1fr))?
1 ответ
grid-template-columns: repeat(auto-fill, minmax(100px, 1fr))
Это означает у вас будет автозаполнение блока элементами с переносом на другую строку, размер этих элементов будет зависеть от экрана но не меньше 100px