Re: [csswg-drafts] [css-anchor-position] `anchor()` Fallback type inconsistency vs WPT (#10831)

A testcase for my previous comment:

```
<!DOCTYPE html>
<style>
.container {
  position: relative;
  width: 100px;
  height: 100px;
  border: 1px solid;
}
.anchor {
  anchor-name: --foo;
  width: 100px;
  height: 10px;
  background: purple;
}

.positioned {
  position: absolute;
  width: 100px;
  height: 10px;
  background: pink;
  top: anchor(--foo bottom);
}

.recursive {
  left: anchor(--foo right, anchor(--foo left));
}

.fallback {
  left: anchor(--foo right);
  position-try-fallbacks: --fb;
}

@position-try --fb {
  left: anchor(--foo left);
}
</style>
<div class="container">
  <div class="anchor"></div>
  <div class="positioned recursive"></div>
</div>
<div class="container">
  <div class="anchor"></div>
  <div class="positioned fallback"></div>
</div>
```

On Chrome Version 134.0.6958.2 (Official Build) dev (64-bit), the first pink element positions to the lower right, where the second one positions directly below the anchor.

Both are fallbacks, but `anchor()` fallback does not consider overflow, where `position-try-fallback` does. That seems like a potential point of confusion.

-- 
GitHub Notification of comment by dshin-moz
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/10831#issuecomment-2598783934 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Friday, 17 January 2025 16:54:47 UTC