On Thu, Oct 2, 2025 at 5:44 PM Emilio Cobos Álvarez <[email protected]>
wrote:
> Is the example right? It seems like that shouldn't work? #anchored is not
> a descendant of #anchored, is it? :)
>
Oops. Thanks for spotting that mistake. Edited the chromestatus entry where
this came from:
#anchored {
position-try-options: flip-block;
container-type: anchored;
}
@container anchored(fallback: flip-block) {
#anchored > .arrow { --arrow-rotation: 180deg; }
}
> -- Emilio
>
> On Thu, Oct 2, 2025, at 12:14 PM, Rune Lillesveen wrote:
>
> *Contact emails*
> [email protected]
>
> *Explainer*
>
> https://github.com/w3c/csswg-drafts/blob/main/css-anchor-position-1/anchored_container_query.md
>
> *Specification*
> https://drafts.csswg.org/css-anchor-position-2/#anchored-container-queries
>
> *Summary*
> Introduce @container anchored(fallback) to style descendants of anchor
> positioned elements based on which of position-try-fallbacks is applied.
>
> Such queries can be used to e.g. style an anchored element's tether, its
> animations, etc. based on how the anchor and the anchored element are
> positioned relative to each other.
>
> Example:
>
> #anchored {
> position-try-options: flip-block;
> container-type: anchored;
> }
> @container anchored(fallback: flip-block) {
> #anchored { --arrow-rotation: 180deg; }
> }
>
> *Blink component*
> Blink>CSS
> <https://issues.chromium.org/issues?q=customfield1222907:%22Blink%3ECSS%22>
>
> *Web Feature ID*
> https://github.com/web-platform-dx/web-features/issues/3403
>
> *TAG review*
> https://github.com/w3ctag/design-reviews/issues/1103
>
> *TAG review status*
> Issues addressed
>
> *Risks*
>
>
> *Interoperability and Compatibility*
> None
>
> *Gecko*: No signal (
> https://github.com/mozilla/standards-positions/issues/1236)
>
> *WebKit*: No signal (
> https://github.com/WebKit/standards-positions/issues/501)
>
> *Web developers*: Positive
> https://bsky.app/profile/jpzwarte.bsky.social/post/3luslfusjps2o
> https://bsky.app/profile/ishadeed.com/post/3lw43wolylc2w Responses to
> this post: https://bsky.app/profile/una.im/post/3lu3qkwadps22
>
> *Other signals*:
>
> *WebView application risks*
>
> Does this intent deprecate or change behavior of existing APIs, such that
> it has potentially high risk for Android WebView-based applications?
> None
>
>
> *Debuggability*
> None
>
> *Will this feature be supported on all six Blink platforms (Windows, Mac,
> Linux, ChromeOS, Android, and Android WebView)?*
> Yes
>
> *Is this feature fully tested by web-platform-tests
> <https://chromium.googlesource.com/chromium/src/+/main/docs/testing/web_platform_tests.md>?*
> Yeshttps://wpt.fyi/css/css-anchor-position/container-queries/
>
> *Flag name on about://flags*
> enable-experimental-web-platform-features
>
> *Finch feature name*
> CSSFallbackContainerQueries
>
> *Rollout plan*
> Will ship enabled for all users
>
> *Requires code in //chrome?*
> False
>
> *Tracking bug*
> https://crbug.com/417621241
>
> *Sample links*
>
> https://codepen.io/una/pen/ZYbzrLg
>
> *Estimated milestones*
> Shipping on desktop 143
> DevTrial on desktop 138
> Shipping on Android 143
> DevTrial on Android 138
> Shipping on WebView 143
>
>
> *Anticipated spec changes*
>
> Open questions about a feature may be a source of future web compat or
> interop issues. Please list open issues (e.g. links to known github issues
> in the project for the feature specification) whose resolution may
> introduce web compat/interop risk (e.g., changing to naming or structure of
> the API in a non-backward-compatible way).
> None
>
> *Link to entry on the Chrome Platform Status*
> https://chromestatus.com/feature/5177580990496768?gate=5193321844310016
>
> *Links to previous Intent discussions*
> Intent to Prototype:
> https://groups.google.com/a/chromium.org/d/msgid/blink-dev/CACuPfeQa%2BJo1gU5uX4V4ukRLgNsLA7BfiTzX3Dyg2gUJOBG0yA%40mail.gmail.com
>
>
> This intent message was generated by Chrome Platform Status
> <https://chromestatus.com/>.
>
> --
> Rune Lillesveen
>
>
> --
> You received this message because you are subscribed to the Google Groups
> "blink-dev" group.
> To unsubscribe from this group and stop receiving emails from it, send an
> email to [email protected].
> To view this discussion visit
> https://groups.google.com/a/chromium.org/d/msgid/blink-dev/CACuPfeTTXWgFr_uJaL2xxjPmsXTWr6Ogi1VtJHB43gGkWyDHUw%40mail.gmail.com
> <https://groups.google.com/a/chromium.org/d/msgid/blink-dev/CACuPfeTTXWgFr_uJaL2xxjPmsXTWr6Ogi1VtJHB43gGkWyDHUw%40mail.gmail.com?utm_medium=email&utm_source=footer>
> .
>
>
>
--
Rune Lillesveen
--
You received this message because you are subscribed to the Google Groups
"blink-dev" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To view this discussion visit
https://groups.google.com/a/chromium.org/d/msgid/blink-dev/CACuPfeQHGXjOOywk2Chx6omrZF0KgLvVrWf%2B-YO%2BTGRJ%2B8fVDA%40mail.gmail.com.
