How can I prevent a header from overlapping a popup on my website?

I’m trying to make a popup show nicely on my website. It’s fine if I scroll down, but if you scroll up the header overlaps the popup which makes it pretty un-user friendly.

See page: https://stickytiles.com.au/products/herringbone-stick-on-tile-pure-white and click on “Show me how to calculate the area!”

Also see attached image.

I’ve tried to adjust the z-index of the popups but it doesn’t seem to work.

I don’t know why the header lights up like that when there’s a lightbox. I’ve turned off sticky header and it still doesn’t help.

Any help is much appreciated!!

1 Like

Hello @stickytiles

I checked however the header doesn’t overlap the popup on my end.

Video checked: https://www.loom.com/share/be081e6599a64545a1788123da2d1c48

Let me know if I missed anything.

Thank you and hope to hear from you.
Best regards,
GemPages Support Team

Try to make your screen height smaller. I have a small screen and want to make sure it fits on all screen sizes.

See the image I originally attached to see what’s happening.

Thanks for the help btw!

Bump!