Kate Morley on Nostr: CSS advice required: It’s easy to create a grid that contains the maximum number of ...
CSS advice required:
It’s easy to create a grid that contains the maximum number of columns subject to a minimum width:
grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
But how do you achieve the opposite: a grid that contains the minimum number of columns subject to a maximum width? This is invalid CSS:
grid-template-columns: repeat(auto-fit, minmax(1fr, 400px));
The use case is a gallery of images, where I want them as big as possible without exceeding a specific maximum.
It’s easy to create a grid that contains the maximum number of columns subject to a minimum width:
grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
But how do you achieve the opposite: a grid that contains the minimum number of columns subject to a maximum width? This is invalid CSS:
grid-template-columns: repeat(auto-fit, minmax(1fr, 400px));
The use case is a gallery of images, where I want them as big as possible without exceeding a specific maximum.