I made a fiddle that demonstrates this behavior:
My desired outcome is a nav bar at the top of the page that sticks there even while scrolling. I assumed that using position: sticky; top: 0; would achieve this. It mostly does, but there is a terrible-looking visual effect here when you scroll down slowly. Even though I am using a CSS reset in my project to make sure default margins are set to 0, I can still see a sliver of other content above the navbar, even despite the top: 0!
Am I implementing this wrong, or is there possibly a better way that doesn't come with this side-effect?
1 Answer
maybe you can try position: fixed and z-index:2
