← Back to release summary

Style Container Queries for CSS Custom Properties

Category
CSS
Type
Chromium catches up
Status
Enabled by default (Chrome 111)
Intent stage
Shipped

Summary

Adds a style() function to @container rules to make it possible to apply styles based on the computed values of custom properties of an ancestor element. style() queries can be combined with size container queries which shipped in M105.

Standards & signals

Samples: https://www.bram.us/2022/10/14/container-queries-style-queries https://una.im/style-queries

Explainers: https://css.oddbird.net/rwd/style/explainer

View on chromestatus.com