Skip to content

[css-anchor-position-1] Retrieving not just position/dimensions of anchors, but other properties as well #8587

Open
@kizu

Description

@kizu
Disclaimer and additional links

I'm submitting my feedback following my experiments with the current implementation of anchor positioning in Chrome Canary.

I wrote an article about my experiments, but decided to fill most of my feedback as separate issues here.

A quick summary of related links:

Ok, this could be a bit far-fetched, and mostly inspired by the inherit() proposed in this issue — #2864, but I just need to mention this :)

What if, for absolutely positioned elements, if we could use a certain element as an anchor, we could then get not just its dimensions and position, but also just any other properties we'd want?

One use-case I thought of — adjusting the color/theme of an absolutely-positioned element based on other elements — if we're attaching an element to a bright target, we draw it with a light mode, if it is attached to a dark element — with a dark mode, and so on.

If we're using multiple elements for the base, we could draw a gradient using the backgrounds of multiple elements as different stops.

Dropdowns could adapt to the target's fonts, elements could adapt to other elements' opacity, visibility etc.

Of course, there'd be some limitations, especially if we'd allow getting the value of CSS variables, but for getting some regular properties via something like anchor-property(background-color) or whatever this maybe could work?

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions