Every element appearing on top of navbar despite z-index changes

Hi,

Ever since implementing particles.js on my Webflow project, everything in the project appears over top of the navbar when scrolling. I have tried changing the z-index of the navbar and other elements but nothing works. Any ideas?

Thanks!

Read only: https://preview.webflow.com/preview/jeremy-ms-beautiful-proje-239a73e5c7666?utm_medium=preview_link&utm_source=designer&utm_content=jeremy-ms-beautiful-proje-239a73e5c7666&preview=af198b19b73d5d804c4469c962967b77&mode=preview

Hey there!

It appears that your Navbar is being housed in a div block called “Div Block 104.” This specific Div has a z-index of “auto.” By changing the z-index of this element to be something higher than the other sections, you should be able to correct the issue.

Let me know if this works! :slight_smile:

Hi Tyler.

Thanks for the reply! Changing the z-index on the div did work. However, I would ideally not want to have to house my navbar in anything (I had done that to try to get rid of the issue) and when I remove the Div Block 104, the issue comes right back. I can’t seem to figure out why simply having my navbar z-index at 3000 does nothing.

Read Only: https://preview.webflow.com/preview/jeremy-ms-beautiful-proje-239a73e5c7666?utm_medium=preview_link&utm_source=designer&utm_content=jeremy-ms-beautiful-proje-239a73e5c7666&preview=af198b19b73d5d804c4469c962967b77&mode=preview

I seem to have fixed it by changing z-index on mobile screens. Thanks!

1 Like