Intrinsic CSS with Container Queries and Units with Miriam Suzanne

CSS has always been contextual, with a Cascade & Normal Flow that allow content & styles to adapt across browsers, writing modes, device interfaces, and user-defined preferences. Media Queries (part of the initial language proposal!) kicked off a decade of Responsive Web Design — with more explicit control over contextual adaptation. But with `@media`, there’s only one global context shared by every element on the page.

Container Queries are here to change that. Join Miriam to learn about how the feature works, how to start using it in production, and what to look forward to as Container Queries continue to evolve.

00:15 Introduction
00:43 “Web for all. Web on everything.”
02:18 Era of Responsive Web Design
04:05 Era of Intrinsic Web Design
05:07 CSS Containment
08:01 Define Containers
10:10 Query Containers
11:30 Nest Containers
12:05 Query Named Containers
14:08 Web components
14:44 Container Query Units
16:27 Fallbacks
16:46 Container Style Queries??
18:52 Conclusion