Heydon’s Holy Albatross is a technique to have a row of elements break into a column of elements at a specific width. A specified parent width, not a screen width like a media query would have. So, like a container query (ya know, those things that don’t exist yet that we all want).
The short answer:
flex-basis are probably what you’re lookin’ for.… Read article “Making width and flexible items play nice together”