Re: [csswg-drafts] [css-position] Ability to set a positioned element's containing block to another element (#5952)

> Could you elaborate on what you mean by "placing in the top layer"?

[This](https://fullscreen.spec.whatwg.org/#top-layer). In particular, top layer elements are hoisted to the top of the DOM and paint in their own stacking context, so all of the complexity of whatever filters, clips, scrolls, transforms and so on above the element that is placed in the top layer is avoided.

There are a whole lot of complexities of those containing block, stacking contexts, effects, compositing and threaded scrolls/animations which would explode in complexity as a result if the element was not in the top layer. And even if it is in the top layer, getting scrolling and animations right relative to something *not* in the top layer is complex.

For `<popup>`, I think there is a much simpler solution in the form of an html attribute. I also think the popup should be dismissed on scroll, for complexity reasons if not because of the UX pattern not needing/wanting it.

Here is an example: load [this page](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/select) in Chrome on ChromeOS, open the "pet" select element, and then scroll the page (doesn't repro on some other platforms, because complexity!). The popup will not remain anchored. This is a bug, but it's a tiny example of the kind of bug I want to avoid having to fix in all its gross generality if it's not truly needed for the UX pattern.

(And as you observe, Chrome is already set up to try to dismiss the select on scroll.)


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


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

Received on Saturday, 13 February 2021 01:19:34 UTC