[css-anchor-position] Default alignment in center track.

[fantasai]

If the only the center region in an axis is selected, or all three regions are selected, the default alignment in that axis is anchor-center.

I'm wondering if the default alignment in the center track should be center instead of anchor-center.

This makes a difference if the author applies asymmetric insets, e.g. given a 100px anchor, suppose there's a 10px inset on the right. Should the item be centered against the entire anchor, or against the inset area?

I suspect the answer should be the inset area, i.e. center. @kizu wdyt?

[kizu]

Mmm, I don't have a strong preference for either.

Quickly testing: https://codepen.io/kizu/pen/qEBRjzo?editors=1100

On the left — anchor-center, on the right — center.

If the inset is larger than the width of the anchor, then I prefer anchor-center. With an anchor larger than the positioned element, I can see how you could want to express that shift from the side. At the same time, you could also use margin for this, which will be, while slightly different, the same for both cases.

If there are actual use cases where this plays a role, we can change it. Otherwise, given this is just a default that can be changed, and I don't see a big effect from the change, I'd stick with the anchor-center for all these cases just for consistency (but, again, no strong preference).

[fantasai]

By default, anchor-center is not supposed to draw outside the inset-modified area -- Chrome has a bug here.

[css-meeting-bot]

The CSS Working Group just discussed [css-anchor-position] Default alignment in center track., and agreed to the following:

• RESOLVED: Default alignment in the center track (single track), default alignment is 'center' not 'anchor-center'.

The full IRC log of that discussion

<TabAtkins> fantasai: i think we got the default alginment wrong for the center track
<TabAtkins> fantasai: you can be in the center track, or span two, or span all three
<TabAtkins> fantasai: with all three, you want anchor-center by default so you're connected to the anchor
<TabAtkins> fantasai: but when you're just in the center track, anchor-center tries to put you centered on the anchor even if you specify an inset
<TabAtkins> fantasai: if you are using an inset, tho, usually that means you're compensating for something
<TabAtkins> fantasai:
<TabAtkins> fantasai: so i think it makes more sense to actually center when we're in just the center track
<TabAtkins> fantasai: kizu posted an example where using center looks weird with the insets, but i think that's actually another bug in chrome, where anchor-center isn't paying attention to the insets properly
<kizu> q+
<fantasai> This makes a difference if the author applies asymmetric insets, e.g. given a 100px anchor, suppose there's a 10px inset on the right. Should the item be centered against the entire anchor, or against the inset area?
<astearns> ack kizu
<kizu> https://github.com//issues/12020
<TabAtkins> kizu: i think i prefer to account for inset-area more
<TabAtkins> kizu: if you're compensating for the dimensions of something, we should honor that
<TabAtkins> fantasai: [example time]
<TabAtkins> fantasai: anchor element, with two bits, a main and a extra bit on the right
<TabAtkins> fantasai: i want my abspos to be below the anchor
<TabAtkins> fantasai: i want to compensate for the right bit, i'm not centering on that
<TabAtkins> fantasai: so use some `right: 10px` to shrink my area to match excluding the right bit of the anchor
<TabAtkins> fantasai: so now my IMCB is a little smaller, centered on the "main" bit of the anchor that I want
<TabAtkins> fantasai: i think it should center in that remaining space
<TabAtkins> fantasai: current spec says to use anchor-center
<TabAtkins> fantasai: which'll ignore the insets, it's caring about the anchor itself not the IMCB
<TabAtkins> fantasai: so I think if the author is explicitly using an inset we should pay attention to that. default shoudl be center, not anchor-center
<bkardell> sounds reasonable
<fantasai> TabAtkins: In the overflow case, where abspos is larger than the IMCB.
<fantasai> TabAtkins: you're saying that it's a chrome bug?
<fantasai> fantasai: Yeah, it'll center against the anchor box, ignoring the insets
<fantasai> fantasai: and I think it should honor the insets
<TabAtkins> (in other words, it should decenter when it's wide enough to hit one edge of the IMCB)
<fantasai> TabAtkins: I don't think I have a strong opinion. Ian, do you have any compat concerns?
<fantasai> iank_: probably compat wise is fine, early enough
<fantasai> iank_: people are usually using top/bottom, not center
<fantasai> astearns: Roman, sounds ok?
<fantasai> TabAtkins: we're basically showing off his example
<fantasai> PROPOSED: Default alignment in the center track (single track), default alignment is 'center' not 'anchor-center'.
<fantasai> RESOLVED: Default alignment in the center track (single track), default alignment is 'center' not 'anchor-center'.