Grid auto-fill or auto-fit min and max-width?
Using
But this still allows for the cards to grow too much, if i instead use a single value like
using
+
is there any way to specifically set a column min/max width using auto-fill so the children are always between for example 300px and 400px?
and also having the columns flow/resize dynamically instead of suddenly snapping at 300/400px "intervals".
grid-template-columns repeat(auto-fill, minmax(300px, 1fr)) gets me 75% of the way thereBut this still allows for the cards to grow too much, if i instead use a single value like
grid-template-columns repeat(auto-fill, 300px) it is also almost what i want but now the columns will stay the same size without any shrinking/growth,using
grid-template-columns repeat(auto-fill, minmax(300px, 1fr)) +
max-width: 400px; on the children of the grid is like 90% of the way there except that if the columns grow bigger than 400px i would have to use justify-items: center; but that gives the children a larger "gap".is there any way to specifically set a column min/max width using auto-fill so the children are always between for example 300px and 400px?
and also having the columns flow/resize dynamically instead of suddenly snapping at 300/400px "intervals".
