4 ms·

>But, grid is nearly useless in a very few circumstances, mainly when you don't know how many items are going to be in a particular space. Have you used implic

>But, grid is nearly useless in a very few circumstances, mainly when you don't know how many items are going to be in a particular space. Have you used implicit rows/columns? You can specify new rows or columns for x new items, the rows/columns are then added automatically for new elements.

RobertRoberts 8y ago
Yes, and for some things (auto rows) it works great almost always, just not mixing auto columns, auto rows and flexible widths with unknown number of items. I love it for things like multiple column forms with a combination of labels and inputs. This works great when I know I want 4 columns. a max/1fr max/1fr (with auto rows) gives me columns and rows that flow with unknown sized labels and inputs like this: Label | Input Label | Input Label | Input Label | Input Label | Input Label | Input But for some things it just doesn't work very well like when you have a gallery of images. I really, really want this to work, so I haven't given up on grid for this, but making an unknown number of columns based on a variable widths in a multi-screen layout just sucks the life out you. Here's an example article from css-tricks on this topic, but notice you have to either give up flexible number of columns, or flexible widths, you can't have both. If you have both, you have flexbox. :P https://css-tricks.com/auto-sizing-columns-css-grid-auto-fill-vs-auto-fit/ https://css-tricks.com/auto-sizing-columns-css-grid-auto-fil...
- deltron3030 8y ago
  I don't think that grid will be able to do that, you'd need some kind of state aware component or function in your compiler/SSG that updates the state of your "mosaic" based on your own settings, so that it can calculate the best possible layout as new items are added to your site and then render/generate it.
  - RobertRoberts 8y ago
    I dont't completely understand your explanation, but flexbox does fill in the few spaces left by grid. (in my experience)

RobertRoberts 8y ago

Yes, and for some things (auto rows) it works great almost always, just not mixing auto columns, auto rows and flexible widths with unknown number of items. I love it for things like multiple column forms with a combination of labels and inputs. This works great when I know I want 4 columns. a max/1fr max/1fr (with auto rows) gives me columns and rows that flow with unknown sized labels and inputs like this: Label | Input Label | Input Label | Input Label | Input Label | Input Label | Input But for some things it just doesn't work very well like when you have a gallery of images. I really, really want this to work, so I haven't given up on grid for this, but making an unknown number of columns based on a variable widths in a multi-screen layout just sucks the life out you. Here's an example article from css-tricks on this topic, but notice you have to either give up flexible number of columns, or flexible widths, you can't have both. If you have both, you have flexbox. :P https://css-tricks.com/auto-sizing-columns-css-grid-auto-fill-vs-auto-fit/ https://css-tricks.com/auto-sizing-columns-css-grid-auto-fil...

deltron3030 8y ago
I don't think that grid will be able to do that, you'd need some kind of state aware component or function in your compiler/SSG that updates the state of your "mosaic" based on your own settings, so that it can calculate the best possible layout as new items are added to your site and then render/generate it.
- RobertRoberts 8y ago
  I dont't completely understand your explanation, but flexbox does fill in the few spaces left by grid. (in my experience)