Hi thanks for this nicly written article. I also really like the illustrations :)
I have one question - I am fairly new to CSS grid so I try to understand its usecases. Why do you prefer using a CSS grid over a mere flexbox for the header and then one flexbox for sidebar and content and footer?
It is so the footer stays in place?
Flexbox is unidirectional, from left to right while CSS Grid is bidirectional. If you follow the course (which is nice and concise) you'll learn that you can combine both grid & flexbox.
Thanks for this article!
I had never heard of Grid, so I am totally new to it.
However, it seems to me that these examples might be misleading in order to understand the use cases for it:
This is really out of pure intuition on my part, since I don't know this at all, but I found your other example with the image grid a lot more suited.
I would love to have your thoughts on this!
It would have been very easy to achieve the same result using Flex only.
The only real use case I can think of when it's essential to use Grid is when there's a long text that has to be dynamically distributed on (changing) number columns.
Would recommend the course to anyone. It's really fantastic and I feel a million times more comfortable with Grid now, whilst also knowing where Flex should comfortably sit in my toolbelt. Thanks again for the article too!
This is so great! Thank you so much for this!
Is grid the end of the line for layout inavation?
There is no "end of the line" for CSS. In anything.
If you can deal with grid, flex, float and block you're already going pretty well here.
In 20 years is grid the way we will do things, what do you predict?
In 20 years we might be able to predict 2 years if technology with decent reliability.
I would personally prefer just using grid, everytime we are forced to use some margin/padding etc it feels like a hack.
Thanks Per, this is super useful!
We're a place where coders share, stay up-to-date and grow their careers.
We strive for transparency and don't collect excess data.