The Flexbox Holy Albatross Reincarnated
when you have three items, you’ll be happy with the three-abreast layout and accepting of the single-column configuration. But you might like to avoid the intermediary part where you get a pair of elements on one line followed by a longer element underneath.
A great responsive layout trick, without any Media Query, so also usable inside a component of any width, awesome!
As mentioned in Heydon's post, Rémi Parmentier already wrote 3 years ago about his Fab Four technique to create Responsive Emails without Media Queries, but I like how Heydon uses custom properties to make it easier (Yes, Remi could obviously not have used them back then.)
We still do need container/element queries, anyway, for other responsiveness needs!
If you want to share an error or suggest an enhancement of this content, please edit the source on Github.