MSEdgeExplainers icon indicating copy to clipboard operation
MSEdgeExplainers copied to clipboard

[CSS Anchored Positioning] Selecting the anchor origin (feedback/questions)

Open noamr opened this issue 4 years ago • 2 comments
trafficstars

In the explainer, it seems like the only way to select the origin of the anchor is using the anchor attribute of a popup element, which would reference another element's ID. I find this to be a bit cumbersome, as it means the following:

  • anchored positioning is limited to the popup element
  • The document needs to manage IDs of all the elements that might have a popup anchored to them. In documents with a lot of tooltips and popup-like functionalities, this can get quite hairy.

I would propose to have an additional CSS property, perhaps anchor-origin like in one of the spec alternatives (or anchor-target?), which would take either an ID or a selector() function (like in Scroll Linked Animations. For popup, it would be automatically be linked to the popup's anchor attribute, but would be available for any fixed-position element, and would be what defines whether a fixed-position element is anchored to an element or to the viewport.

noamr avatar Jun 06 '21 06:06 noamr

Thanks for the feedback, @noamr, will take this into consideration!

The anchor attribute is currently just part of the <popup> proposal, but we imagine that some popup-related attributes could be extended to other elements. anchor would be one such example. For perf reasons we're currently thinking that anchored positioning is limited to (current and future) browser-managed, top-layer elements, but there's discussion on this point on #489.

melanierichards avatar Jun 07 '21 18:06 melanierichards

Thanks for the feedback, @noamr, will take this into consideration!

The anchor attribute is currently just part of the <popup> proposal, but we imagine that some popup-related attributes could be extended to other elements. anchor would be one such example. For perf reasons we're currently thinking that anchored positioning is limited to (current and future) browser-managed, top-layer elements, but there's discussion on this point on #489.

Gotcha. I would like to point out that perf reasons could be elusive some times when considering their balance with flexibility... In this context, a lot of people implement popover solutions with Javascript, and if by providing an in-browser solution that is flexible enough they could ditch their JS, the perf benefits my outweigh the cost. OTOH, if the in-platform implementation has a very specific UI in mind, some devs would choose to keep the custom JS solutions, and we didn't improve things for them

I am hoping for a solution that allows for a curated element like popup, alongside an ability to use only some of its mechanics (top-layer, anchoring) without taking the whole package deal. I will keep posted on the other issue. thanks!

noamr avatar Jun 08 '21 10:06 noamr