Re: [csswg-drafts] [css-anchor-position] Is `anchor()` fallback used when outside of inset properties? (#10950)

To clarify, playing around with a testcase on Chrome Canary 136.0.7095.0:

```
<!DOCTYPE html>
<style>
/* Statically-positioned, anchor functions invalid */
#static {
  /* Anchor does not exist */
  left: anchor(--foo left, 12345px);
  /* Wrong axis */
  right: anchor(--foo top, 12345px);
  /* Not an inset property, but supports anchor-size() */
  width: anchor(--foo left, 12345px);
  /* Not an inset property, does not support any other anchor function. */
  padding-left: anchor(--foo left, 12345px);

  /* Anchor does not exist */
  top: anchor-size(--foo height, 12345px);
  height: anchor-size(--foo height, 12345px);
  /* Not a sizing, inset, or margin property */
  padding-top: anchor-size(--foo height, 12345px);
}

/* Absolute-positioned, anchor functions may be valid */
#abs {
  position: absolute;

  /* Anchor does not exist */
  left: anchor(--foo left, 12345px);
  /* Wrong axis */
  right: anchor(--foo top, 12345px);
  /* Not an inset property, but supports anchor-size() */
  width: anchor(--foo left, 12345px);
  /* Not an inset property, does not support any other anchor function. */
  padding-left: anchor(--foo left, 12345px);

  /* Anchor does not exist */
  top: anchor-size(--foo height, 12345px);
  height: anchor-size(--foo height, 12345px);
  /* Not a sizing, inset, or margin property */
  padding-top: anchor-size(--foo height, 12345px);
}
</style>
<div id="static"></div>
<div id="abs"></div>
<script>
for (const d of [static, abs]) {
  const cs = getComputedStyle(d);
  console.log(d.id, cs.left, cs.right, cs.width, cs.paddingLeft, cs.top, cs.height, cs.paddingTop);
}
</script>
```

Outputs

```
static 12345px 12345px 551px 0px 12345px 12345px 0px
abs 12345px 12345px 0px 0px 12345px 12345px 0px
```

Current behaviour seems to be that any use of anchor functions outside of supported properties behaves as if the declaration is invalid - Though they show as "Invalid property value," which makes me think they're rejected at parse time.


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


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

Received on Friday, 28 March 2025 17:34:55 UTC