Skip to content

Commit

Permalink
[css-anchor-position] anchor() and anchor-size() resolve at *computed…
Browse files Browse the repository at this point in the history
…* time, using interleaving. #8181
  • Loading branch information
tabatkins committed Apr 8, 2024
2 parents 9f3e248 + 7f2cacd commit 944f711
Showing 1 changed file with 13 additions and 10 deletions.
23 changes: 13 additions & 10 deletions css-anchor-position-1/Overview.bs
Original file line number Diff line number Diff line change
Expand Up @@ -775,16 +775,9 @@ The ''anchor()'' function has three arguments:
specifying what the function should resolve to
if it's an [=invalid anchor function=].

Issue: Computed value for anchor()
probably needs to be the anchor() function,
but with the target anchor element resolved.
This allows for transitions to work properly
with tree-scoped names,
and with changing anchor elements.
See <a href="https://github.com/w3c/csswg-drafts/issues/8180">Issue 8180</a>.

An ''anchor()'' function representing a [=valid anchor function=]
resolves at [=used value=] time
resolves at [=computed value=] time
(using [=style & layout interleaving=])
to the <<length>> that would align the edge
of the positioned elements' [=inset-modified containing block=]
corresponding to the property the function appears in
Expand All @@ -795,6 +788,14 @@ and the positioned element's [=containing block=]
are scrolled to their initial scroll position
(but see [[#scroll]]).

Note: This means that [=transitions=] or [=animations=]
of a property using an [=anchor function=]
will work "as expected" for all sorts of possible changes:
the anchor element moving,
anchor elements being added or removed from the document,
the 'anchor-name' property being changed on anchors,
etc.

If the [=target anchor element=] is [=fragmented=],
the axis-aligned bounding rectangle
of the fragments' border boxes is used instead.
Expand Down Expand Up @@ -1175,7 +1176,9 @@ or the [=writing mode=] of the element's [=containing block=]
(for ''anchor-size()/block'' and ''anchor-size()/inline'').

An ''anchor-size()'' function representing a [=valid anchor-size function=]
resolves to the <<length>> separating the relevant border edges
resolves at [=computed value=] time
(via [=style & layout interleaving=])
to the <<length>> separating the relevant border edges
(either left and right, or top and bottom,
whichever is in the specified axis)
of the [=target anchor element=].
Expand Down

0 comments on commit 944f711

Please sign in to comment.