Currently, if any element spans multiple columns when using auto-fill, the grid is incapable of gracefully handling sizing below that amount of columns. The extra columns get squished, as demonstrated in the following example:

Using a syntax like span-minmax(1, 3) to clamp the spanning (as proposed by @MatsPalmgren here) would allow the grid to be fully responsive.

One such use case mentioned on that issue is:

• Have "featured" items span multiple columns, but only when the columns become available