Web platform features explorer - Container style queries

Web platform features explorer

Container style queries with the @container at-rule apply styles to an element based on the values of custom properties of its container.

Status

Limited availability

MDN documentation

@container

Specifications

CSS Conditional Rules Module Level 5 (#style-container), from Cascading Style Sheets (CSS) Working Group (W3C).

Browser support (view on caniuse.com)

Chrome 111 Released on 2023-03-07
Chrome Android 111 Released on 2023-03-07
Edge 111 Released on 2023-03-13
Firefox ❌ See bugzil.la/1795622 Vendor position : positive
Firefox for Android ❌ See bugzil.la/1795622 Vendor position : positive
Safari 18 Released on 2024-09-16
Safari on iOS 18 Released on 2024-09-16

Baseline availability blocked since September 2024 by Firefox (10 months)

Developer signals

State of CSS 2025: features/all_features question
State of CSS 2024: usage/css_interoperability_features question
State of CSS 2024: reading_list/reading_list question
State of CSS 2024: features/all_features question

Usage (according to Chrome Platform Status)

~0.294% of page loads. More data at chromestatus.

Web Platform Tests (WPT)

View the latest WPT test results for this feature

View as JSON | Edit this feature | Report an issue | Web-features entry: source, dist