Learn Development at Frontend Masters
It’s sounding more and more likely that we’re actually going to get real container queries. Google is prototyping a syntax idea from David Baron and refined by Miriam Suzanne. Apparently, there has already been some prototyping done for a switch() syntax which is like container queries on values. Even now, there is stuff like the Raven technique which can do container query-esque values. This stuff will shake out over time.
If you need solutions today, most of them involve JavaScript watching what is going on (i.e. the container width) and then giving you some kind of styling hooks (e.g. classes). Here’s a quick review of the “minimal takes” landscape:
There is also Tommy Hodgins’ EQCSS, which does container queries (and other stuff) by looking through your CSS for the invented syntax that does these fancy things. I wouldn’t really call it minimalist, and it slightly creeps me out to ship invalid CSS syntax, but it does look robust.
Laying out designs on the web with CSS has gotten a lot more powerful in recent years. CSS grid and flexbox are incredibly powerful tools for that, and Frontend Masters has a complete learning course on them from Jen Kramer.
Laying out designs on the web with CSS has gotten a lot more powerful in recent years. CSS grid and flexbox are incredibly powerful tools for that, and Frontend Masters has a complete learning course on them from Jen Kramer.