What’s your favorite? For what? Strong opinions welcome :-)
Flexbox :) Why? The ability to reorder stuff on different screen sizes with order:x is SUPER awesome. I find CSS Grid to be very tabular by comparison.
With grid you can also reorder stuff.
It was the whole point of grid on the first place.
I wasn't aware of this! I haven't used grid a huge amount. Honestly flexbox does what I need it to, so haven't felt the need to pick up grid yet.
I often use flexbox myself.
There are certain cases where it's easier to layout things with flex rather than grid.
I often use this tool to generate working grids then I can just copy and paste: grid.layoutit.com/
Useful website - thank you for sharing!
Grid takes reordering to a whole new level. Skim this article I wrote a while ago about one of my favorite features of Grid:
Excellent article. Thanks for sharing. The ASCII art specification is a great idea.
Oh man, for high-level layouts, like at the whole page level, it's an absolute game changer. I can't wait for Subgrid to complete the Grid picture!
I use Grid more than Flex at this point, but they both server very important roles.
When I want to work "Layout in" i.e. Define how my layout should work and flow my content into it, I use Grid. In my current life, I do this methodology a lot.
When my content needs to control the size of my elements, i.e. in a navigation or something similar, I use Flex and it works really well.
I also really enjoy using flex inside a grid item to control awkward whitespace issues (the hardest part of web design, figuring out what to do with awkward whitespace!).
I think the important thing when choosing a layout mechanism is this: If you have to drastically modify your markup to make the layout mechanism work, you may be using the wrong tool for the job.
I wrote an article on this a little while ago
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.