Banner Overlay Still Displaying Nav-Bar Elements

[AdamMMB (Adam Gosciniak)]

I have placed a banner on my website - its called “Sign Up Banner” - symbol. The way it works is that its triggered by a button click and should overlay on the existing webpage. However currently during the overlay, it is still displaying the Nav bar text elements, image and button. I suspect that is because I placed the nav-bar within the first section and made its placement an absolute - pinned to the top. I had to do this so it was visible based on the template I was using.

If anyone has any ideas or advice how I can cover the nav-bar elements underneath the banner overlay I would strongly appreciate it!

Resources:

Website Read Link: https://preview.webflow.com/preview/newwebsitebot?utm_medium=preview_link&utm_source=designer&utm_content=newwebsitebot&preview=7a2aa6fbce59e5568bcea2c37b09ab07&workflow=preview
Image of nav bar elements showing: Screenshot by Lightshot

Any help will be strongly appreciated!

[imtiazraqib]

Hey @AdamMMB , this can be fixed by using z-index. Your Navbar’s z-index is 9999 whereas your banner overlay is only 3.

Change Navbar’s z-index to 10 and then change the z-index of your banner overlay to 20 and you should be good to go.

[AdamMMB (Adam Gosciniak)]

Absolute legend. Thank you so much!

[imtiazraqib]

Ayeee my guy! Don’t make me blush , Happy Designing