body { overflow-x: hidden; } breaks position: sticky

Question

I have an element that I am making sticky with position sticky:

#header {
    position: sticky;
    width: 100vw;
            


        

Answer 1

The sticky doesn't work inside element with overflow: hidden or auto. Refer to this https://developer.mozilla.org/en-US/docs/Web/CSS/position#sticky

A workaround can be working with this library