Differences between `auto-fill` and `auto-fit`
Thomas Mak wrote at 2018-01-06.
The difference happens when there are not enough content to fill up all columns.
When the screen is wide enough to fill in more "minmax(200px, 1fr)" columns, auto-fill
will fill extra empty 200px width columns.
When it is auto-fit
, extra column works only where there is content there. So there wonβt be any extra empty columns in auto-fit
.
Checkout the following codepen demo for their differences.
https://codepen.io/makzan/pen/dJZXPp?editors=1100
- Try resizing the browser.
- Try adding more photos into the container.
- Try changing the
minmax
value.
Comments
no comments yet.