Transparent Navigation Bar over my Hero Image

Question

I am attempting to get a transparent navigation bar over my hero image on my Home page. I have set the hero position to relative, and the navigation bar to absolute, yet it seems the only result this brings is my navigation bar BEHIND my hero image instead of on top of it. Ive attempted putting the navigations section within the div of the hero along with my H1, yet i'm not sure how to reposition only the nav. I even tried playing with flex boxes to see how that would work and it didn't. i'm having trouble, help.

Answer 1

Use positive z-index for your navigation bar, for example: z-index:1 .