Re: [csswg-drafts] [css-anchor-position] Layered positioning (#9816)

There was a [mastodon thread](https://front-end.social/@mayank/113376766689246458) a month ago, from which I came up with two things that feel like they make sense to me regarding this issue (and some others):

1. I would love to be able to use `z-index: anchor()` and `z-index: calc(anchor() - 1)` etc. While this won't cover _all_ use cases (like the different stacking contexts case), it will cover _most_ of them.

    While we now have the “top layer”, not everything that will be using anchor positioning will use it, thus we'll still need to use `z-index`, and be able to _match_ in some way the `z-index` of an anchored element to its anchor.
    
    My proposal here: allow `anchor()` for `z-index` (in which case it will be `anchor( <anchor-name>?, <integer>? )`) — seems trivial to implement, and will cover this use case well enough (cases with the stacking context and reparenting as a potential fix are out of scope, but will play nicely with this).

2. The above does not cover the case with overlays: authors must have a way to place an element that is anchored to something inside the top layer in the same layer, even if the anchored element is placed outside its tree. Without this, we couldn't use anchor positioning for anything involving the top layer without relying on JS for either moving the element in the DOM, or placing it into a new top layer.

    I have two potential proposals:
    - a) Allow attaching elements with fixed positioning to elements in the top layer, automatically promoting such element to the same layer (using the `position-anchor`). This will be something that authors would expect to just work.
    - b) If, for some reason, the above is not enough, allow `overlay: anchor()` (just `anchor( <anchor-name>?)` I guess?) for elements with `position: fixed`.

    In both cases, the acceptable anchor criterion should work as if both elements had just `position: fixed`. I can also see both work at the same time: using the `position-anchor` to follow that anchor by default, and allowing switching which top layer to use via the `overlay` property.
    
This would allow matching the position of the anchor element, but won't allow just abstractly placing things into a new top layer, thus not resulting in the arms race similar to `z-index`.

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


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

Received on Thursday, 21 November 2024 22:15:38 UTC