scroll-margin is ignored if target element has transition-duration > 0s
Categories
(Core :: Layout: Scrolling and Overflow, defect, P3)
Tracking
()
People
(Reporter: 6k64x4ma, Unassigned)
References
Details
Attachments
(1 file)
816 bytes,
text/html
|
Details |
User Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:109.0) Gecko/20100101 Firefox/110.0
Steps to reproduce:
- Set
ui.prefersReducedMotion
to 1 in about:config. - Go to https://developer.mozilla.org/en-US/docs/Web/HTTP/Caching
- Click on the link under the "In this article".
or
- Load the attached file.
- Click on the link to "baz", which has
transition-duration: 1ms;
.
Actual results:
scroll-margin is ignored.
If I click on the link twice, scroll-margin is applied.
I can also reproduce this issue on Firefox 68.
Expected results:
scroll-margin should be respected.
Comment 1•2 years ago
|
||
Interesting test case. I think this is more or less related to our CSS transition implementation. Though I am not sure it's valid. (I would say it's invalid.)
Anyway, there's a style :traget { scroll-margin: 10vh; }
, thus with transition-duration: 1ms
, there are four CSS transitions generated, scroll-margin-top from 0 to 10vh, for example. And when we navigate to #baz, the computed scroll-margin values are 0, thus it looks as it it's ignored.
In the scroll-snap spec, scroll-margin is defined as animatable by computed value type, but it looks to me that changing the specified value doesn't require scroll position changes.
Ah, the real problem here seems to be that Microsoft Edge doesn't apply transition to scroll-margin.
Comment 3•2 years ago
|
||
Filed a spec issue; https://github.com/w3c/csswg-drafts/issues/8445
Description
•