Imagine that we have flexbox as a technique for creating grid layouts, but its design is meant for simpler, one-dimensional layouts; it doesn't work so well if the layout is complicated! Is there an answer, something better, that is designed for the job?
Fortunately there is; I am of course referring to a relatively new technology, named CSS Grid Layout. Support for this is minimal for now, but this is likely to change. In a nutshell, it provides a simpler way to create grids in a browser, without the plethora of options we saw with flexbox.
The downside of using CSS Grid Layout as a technology is that support for it has yet to hit mainstream; it is supported in IE11/Edge, but only under the -ms-
prefix. Opera, Firefox, and Chrome offer support, but all require a flag to be enabled to view the results:
Leaving aside the concerns about support for a moment, it is easy to see why CSS Grid Layout will take off as a technique. The whole concept has been...