Re: [csswg-drafts] [css-values-4] Add new relative length units that are relative to the size of the system cursor (#8315)

Maybe instead of new units this could be solved via [CSS Anchor Positioning](https://drafts.csswg.org/css-anchor-1/). A new `cursor` keyword could be introduced that dynamically resolves to the cursor's width or height depending on the [`<anchor-side>`](https://drafts.csswg.org/css-anchor-1/#typedef-anchor-side).

So positioning the tooltip could then look like this:

```css
.tooltip {
  position: absolute;
  left: calc(anchor(cursor right) + 10px);
  top: calc(anchor(cursor bottom) + 10px);
}
```

Not sure whether the cursor's hotspot really needs to be taken into account here but that could surely be expressed via keywords as well.

The keyword probably would have to compute to itself in order to avoid fingerprinting.

The big benefits of this approach are that it's a pure CSS solution and it's very concise in comparison to the JS solution. Also, Anchor Positioning already provides fallbacks for the case when the element would overflow its containing block.

Sebastian

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


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

Received on Monday, 16 January 2023 22:24:07 UTC