Разница между auto-fill и auto-fit при создании колонок в CSS grid заключается в следующем:
- auto-fill заполняет строку максимально возможным количеством столбцов. 1 Новые колонки могут быть пусты, но они всё равно будут занимать отведённое им место в строке. 1
- auto-fit подгоняет текущее количество колонок под доступное пространство, расширяя их так, чтобы они заняли всё доступное пространство. 1 Браузер делает это после заполнения доступного пространства новыми колонками (как и auto-fill), после чего сжимает пустые столбцы. 1
Таким образом, auto-fill позволяет пустым колонкам занимать место в строке наравне со своими непустыми соседями, а auto-fit сжимает пустые колонки и отдаёт больше места под заполненные. 13