Flex or Grid
I admit that I didn't realise that this was such a big issue. I guess that my autodidactic approach to web design has led me to this observation through the "back door".
Although I have not explored this in great detail the best explanation I have found so far is from css-tricks.com. I need to read their article on the subject in more detail.
In my somewhat "free-hand" approach to layout design I used the terminaology Image-Grid for my page Responsive Image Grid. Looking more closely at the code I see that it is using a -flex technique (for my responsive image grid). I think that I copied the code from the W3C website (see link below).
The code below is from my Responsive Image Grid page. Although it is called "Grid" it is a "flex" design.
The CSS for the flex-grid:
/* Create four equal columns that sits next to each other */
.columnr {
-ms-flex: 25%; /* IE10 */
flex: 25%;
max-width: 25%;
padding: 0 4px;
}
.columnr img {
margin-top: 8px;
vertical-align: middle;
width: 100%;
}
The css-tricks expanation:
At the moment there is a lot to take in. I copied the first image below (I hope they don't mind too much!):
Flexbox on top, Grid on bottom
I don't really see the 1D and 2D nature of some of the description and comments from other readers.