Container queries enable us to style an element depending on the size of its parent. This is a crucial difference from media queries, which only query the viewport. This has long been a problem for responsive design, as often we want a component to adapt to its context. Some are already starting to land in browsers, others are likely to gain widespread browser support in 2022.

13m read timeFrom smashingmagazine.com
Post cover image
Table of contents
Container Queries:has()@when/@elseaccent-colorNew CSS Color FunctionsCascade LayersSubgridScroll TimelineNestingThe Future of CSS

Sort: