Container Queries: The Past, Future, and How You Can Actually Even Use Them Today
summary
Explains why native container queries are hard, demonstrates a practical pattern using ResizeObserver plus CSS containment to avoid infinite-layout loops, and ships a working demo that degrades to plain CSS without JavaScript. Claims ResizeObserver is available to over two billion users, shows polyfill paths, and implements responsive components with custom elements so they work in IE and even when JS is disabled. Presents actual code, performance tradeoffs, and which browser primitives matter now.
AI-written summary · about
chapters (7)
- 0:00Intro
- 0:24History
- 6:32Infinite Loops
- 8:21The Cascade
- 16:31Responsive Components
- 21:50Container Queries
- 25:23Predictions
related talks
19mContainer Queries
45mSolving container queries today
17mContainer queries, the next step towards a truly modular CSS
54mCSS Containers, What Do They Know?
48mWhat Are Container Queries and Why You Need Them
22mThe next step towards a truly modular CSS
49mContainers, What Do They Know?
28mResponsive Components: Present & Future