← Back to release summary

CSS Name-only Container Queries

Category
CSS
Type
Chromium catches up
Status
Proposed (Chrome Proposed)
Intent stage
None

WPT details: https://wpt.fyi/results/css/css-conditional/container-queries/query-container-name.html?label=experimental&label=master&aligned https://wpt.fyi/results/css/css-conditional/container-queries/query-container-name-dynamic.html?label=experimental&label=master&aligned

Summary

A CSS query container can be queried based on its container-name only, and the container does not need any container-type set: <style> #container { container-name: --foo; } @container --foo { input { background-color: green; } } <style> <div id="container"> <div><input></div> </div> Previously, @container required some query in addition to the name.

Motivation

Catch up with spec and other implementations which are about to ship support for name-only queries.

Standards & signals

Ecosystem

View on chromestatus.com