Re: [csswg-drafts] [css-anchor-1][css-position] Add the “centering” behavior which is now defined as an example in the specs as something built-in (#8979)

> 1. ... if we could improve on the method described in the specs regarding the calculation ...

This actually seems to be the most feasible idea to me. We just need to add a new anchor value, e.g.:

`anchor(center-align)`

which automatically unfolds into

`min(abs(0% - anchor(center)), abs(100% - anchor(center)))`

then we can achieve centering with two lines of CSS

```css
inset-inline: anchor(center-align);
justify-self: center; /* The proper way to do centering in positioned layout, but lacking browser support */
margin-inline: auto; /* Fallback if the browser doesn't support it */
```

> 2. Allow using the dimensions of the element itself somehow when anchoring.

`anchor-size(self-width)` doesn't look compatible with the current design, where `anchor-size()` needs to be treated as a regular `<length>`, can participate in `calc()` and must be evaluated into a pixel value before laying out the element.

To make it compatible, it has to be a new keyword value, something like `width: self-anchor-width`, but then it can't participate in any `calc()` any more.

> 3. ... what if we could have something like a `inset-center` or something ...

That's an interesting idea.

It's also more general than anchor positioning that it should go to the CSS Positioned Layout module instead.

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


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

Received on Friday, 30 June 2023 18:56:00 UTC