| Flex: 1. For unknown number of items in one direction. (toolbar of buttons works better in flex) 2. Row-wrapping items. (ie, the unknown number of items need to flow with the screen, grid _stinks_ horrible at this) Grid: 1. Specific forced number of columns but unknown number of rows (the control is the ultimate, flexbox still does some loosey-goosey stuff where grid stays put). Also, when I know exactly what I want and where it will go and there is no ambiguity about it, grid is perfect. Rows are implicit (ie, any number of rows) This makes clean form building a dream... 2. Specific layout with areas. Think header, columns, footer all part of a unified design. Way, easier in grid than in flexbox. Grid has grid-gap, which is vital for making some layouts easy. Flex only has grid-gap in Firefox, so you are stuck with flippin margins for item spacing in flexbox still, yuck. |