> I only dabble in HTML, but for the kinds of layout I find myself doing, grid comes up more than flex does.
It depends on whether the content is fixed to desktop monitors or responsive to mobile screens. Grid doesn't give the same responsiveness flexibility when the page is displayed on mobile.
In my experiments with grid vs flexbox, every single time I used grid, I had to switch over to flexbox the minute I needed the content to display on mobile screens.
My usage of grid turned out to be simply a different form of tables, which don't work well (or at all) on mobile screens.
What I did with grid was use media (or container, easier to debug at top level and necessary when nested) queries to do a completely separate layout for the same DOM when the viewport (or parent) was too small horizontally. The problem with flex is that it means "adjacent" elements can randomly wrap anywhere even if they really belong close to each other, whereas with grid I could arrange for closeness separately for each available horizontal size.
> The problem with flex is that it means "adjacent" elements can randomly wrap anywhere even if they really belong close to each other, whereas with grid I could arrange for closeness separately for each available horizontal size.
I don't put down a flex and leave it at that; I use media queries to change it between flex-horizontal and flex-vertical. This means that I either wrap at particular width for desktop, or "wrap" at every cell for mobile.
Granted, it's not perfect as it only supports two classes of screen size - desktop or mobile :-)
It depends on whether the content is fixed to desktop monitors or responsive to mobile screens. Grid doesn't give the same responsiveness flexibility when the page is displayed on mobile.
In my experiments with grid vs flexbox, every single time I used grid, I had to switch over to flexbox the minute I needed the content to display on mobile screens.
My usage of grid turned out to be simply a different form of tables, which don't work well (or at all) on mobile screens.