Skip to content

[css-anchor-position-1] Behavior with transforms and offset-path #8584

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:

Right now, the positions for the anchors do not take into account things like transforms, offset-path (position: sticky, which is covered by #8448).

In practice, there were cases in my experiments where I wanted to use those — transforms and offset-path for the animations/transitions (see the animations for the “four quadrants” in my article — I want to attach things that move, but because transforms or offset-paths are not used, I have to animate things via top and left).

Currently, specs do not mention any of these cases — if those are intended to not be supported, the specs should be clarified, but I would suggest looking into providing an option to somehow follow those.

I understand that for the transforms and offset-path things are probably much more complicated — but I foresee a lot of cases where developers would want an option to follow those. I wonder if this could be something like anchor-transform or whatever, which could be optionally used with transform on the anchored element? And maybe something similar with offset-path (though, maybe it could be similar to position: sticky in that it is easier to describe how it could work by default?)

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