The Range Syntax Has Come to Container Style Queries and if()
AI Summary1 min read
TL;DR
Chrome 142 now supports range syntax in container style queries, allowing comparisons of numeric values using custom properties or attr(). This enhances CSS flexibility for dynamic styling.
Tags
Articlescontainer-queriesCSS functionsmedia queriesStyle Queries
Being able to use the range syntax with container style queries — which we can do starting with Chrome 142 — means that we can compare literal numeric values as well as numeric values tokenized by custom properties or the attr() function.
The Range Syntax Has Come to Container Style Queries and if() originally published on CSS-Tricks, which is part of the DigitalOcean family. You should get the newsletter.