From 3e9434646953833982f653eebb1f159af7dbf4bf Mon Sep 17 00:00:00 2001 From: "Daniel D. Beck" Date: Tue, 25 Nov 2025 18:41:43 +0100 Subject: [PATCH 1/3] Add feature for range syntax for style queries --- features/style-query-range-syntax.yml | 9 +++++++++ features/style-query-range-syntax.yml.dist | 6 ++++++ 2 files changed, 15 insertions(+) create mode 100644 features/style-query-range-syntax.yml create mode 100644 features/style-query-range-syntax.yml.dist diff --git a/features/style-query-range-syntax.yml b/features/style-query-range-syntax.yml new file mode 100644 index 00000000000..19e02a15dbc --- /dev/null +++ b/features/style-query-range-syntax.yml @@ -0,0 +1,9 @@ +name: Range syntax for style queries +description: The `@container style()` CSS at-rule and `if(style())` CSS function queries accept a range syntax, such as `>`, `<`, `>=`, `<=`, to query for inexact values. +spec: https://drafts.csswg.org/css-conditional-5/#typedef-style-range +group: container-queries +# expected compat_features: +# - css.types.if.style.range_syntax +# - css.at-rules.container.style_queries_for_custom_properties.range_syntax +# This is a bit of an oddity, where someday this feature will split in two, +# merging its constituent parts into `container-style-queries` and `if`. diff --git a/features/style-query-range-syntax.yml.dist b/features/style-query-range-syntax.yml.dist new file mode 100644 index 00000000000..55409486c8b --- /dev/null +++ b/features/style-query-range-syntax.yml.dist @@ -0,0 +1,6 @@ +# Generated from: style-query-range-syntax.yml +# Do not edit this file by hand. Edit the source file instead! + +status: + baseline: false + support: {} From 1cd33d7301247bb07d30375b8bb2704bbbe86924 Mon Sep 17 00:00:00 2001 From: "Daniel D. Beck" Date: Thu, 27 Nov 2025 17:12:21 +0100 Subject: [PATCH 2/3] Add compat keys --- features/style-query-range-syntax.yml | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/features/style-query-range-syntax.yml b/features/style-query-range-syntax.yml index 19e02a15dbc..3206840ccff 100644 --- a/features/style-query-range-syntax.yml +++ b/features/style-query-range-syntax.yml @@ -2,8 +2,8 @@ name: Range syntax for style queries description: The `@container style()` CSS at-rule and `if(style())` CSS function queries accept a range syntax, such as `>`, `<`, `>=`, `<=`, to query for inexact values. spec: https://drafts.csswg.org/css-conditional-5/#typedef-style-range group: container-queries -# expected compat_features: -# - css.types.if.style.range_syntax -# - css.at-rules.container.style_queries_for_custom_properties.range_syntax # This is a bit of an oddity, where someday this feature will split in two, -# merging its constituent parts into `container-style-queries` and `if`. +# merging its constituent compat keys into `container-style-queries` and `if`. +compat_features: + - css.types.if.style.range_syntax + - css.at-rules.container.style_queries_for_custom_properties.range_syntax From d4575fd1fb85a286d73fd5ae8b0e205991d7d07a Mon Sep 17 00:00:00 2001 From: "Daniel D. Beck" Date: Mon, 8 Dec 2025 16:56:26 +0100 Subject: [PATCH 3/3] Fix key assignments --- features/container-style-queries.yml | 2 ++ features/container-style-queries.yml.dist | 23 +++++----------------- features/style-query-range-syntax.yml.dist | 8 +++++++- 3 files changed, 14 insertions(+), 19 deletions(-) diff --git a/features/container-style-queries.yml b/features/container-style-queries.yml index 1bf8bf6a297..0b69fda048c 100644 --- a/features/container-style-queries.yml +++ b/features/container-style-queries.yml @@ -3,3 +3,5 @@ description: Container style queries with the `@container` at-rule apply styles spec: https://drafts.csswg.org/css-conditional-5/#style-container group: container-queries caniuse: css-container-queries-style +compat_features: + - css.at-rules.container.style_queries_for_custom_properties diff --git a/features/container-style-queries.yml.dist b/features/container-style-queries.yml.dist index 65a73f29ca2..f01df2a68cd 100644 --- a/features/container-style-queries.yml.dist +++ b/features/container-style-queries.yml.dist @@ -4,23 +4,10 @@ status: baseline: false support: - chrome: "142" - chrome_android: "142" - edge: "142" + chrome: "111" + chrome_android: "111" + edge: "111" + safari: "18" + safari_ios: "18" compat_features: - # baseline: false - # support: - # chrome: "111" - # chrome_android: "111" - # edge: "111" - # safari: "18" - # safari_ios: "18" - css.at-rules.container.style_queries_for_custom_properties - - # ⬇️ Same status as overall feature ⬇️ - # baseline: false - # support: - # chrome: "142" - # chrome_android: "142" - # edge: "142" - - css.at-rules.container.style_queries_for_custom_properties.range_syntax diff --git a/features/style-query-range-syntax.yml.dist b/features/style-query-range-syntax.yml.dist index 55409486c8b..b9362e12956 100644 --- a/features/style-query-range-syntax.yml.dist +++ b/features/style-query-range-syntax.yml.dist @@ -3,4 +3,10 @@ status: baseline: false - support: {} + support: + chrome: "142" + chrome_android: "142" + edge: "142" +compat_features: + - css.at-rules.container.style_queries_for_custom_properties.range_syntax + - css.types.if.style.range_syntax