Jump to content

Sticky Nav inside a Div


MCB
 Share

Recommended Posts

Hey, i am new to making Websites and wanted to make my Navigation Bar sticky, using the "position: sticky" and "top: 0" commands in CSS.

The Navigation Bar is supposed to be transparent above a full screen Video in the Background, thats why i have the Video (using <video> <source src="..."> </video>) in the same DIV as the NAV.

I guess this is why the sticky NAV bar only sticks to the top of the screen for the size of the DIV.

After i scroll down one viewport, the NAV bar stops to stick, at the exact height where the DIV ends.

 

If i put the NAV outside this DIV, it is allways above on the Y-Axis, but i want it above on the Z-Axis. I´ve tried using the "z-index", but this wont work. The Nav stays just a white (body background color) block at the top of the screen.

 

Would really appreciate some assistance.

Thank you for you´re time.

Best Regards

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...