Click targets scroll away with sticky elements - bug?

Hey Tyler, I was not able to replicate this issue on my end 🤔
I would suggest here contacting support

Your prototype appears to be using position: fixed rather than position: sticky, but I can’t be sure without seeing the file. I have found that position: sticky works when there are no vertical margins applied, but adding the vertical margins is what seems to break it.

I’m attaching a prototype that demonstrates the issue. In the one that works you will see that the button scrolls behind the iPhone frame and so I would like to add some margin to the frame to prevent that from happening when it sticks at the top. Adding a vertical margin, however; is what seems to allow the click hotspot to detach and continue scrolling independent of its parent element. The hotspot will continue scrolling until it hits the top of the page, at which point it will stick. It seems as those the hotspot does not respect the parent element’s margins.

Having the same issue - I have a header with a button (say, the Y position is 50px within this header that is sticky), but the hotspot for that button keeps scrolling up once the header sticks - and the hot spots go all the way to the 0px position. Looking forward to a fix!

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.