I’m trying to make a bottom navigation bar but it won’t work!

I’m following W3Schools. I have the navigation bar set to bottom: 0; and Position: fixed;

On W3Schools, it shows the bar scrolling with the screen, always at the bottom.

I can’t find why, but my bar is always a little bit above the bottom of the screen (unless I increase the content for the screen to become scrollable) and it doesn’t scroll. It’s just stuck at the bottom.

I also have a page with a TikTok style video scroller, and that completely hides the nav bar at the bottom no matter what.

Is there a way for my navbar to be ontop of my content? Like it has priority to cover it? I’ve tried fiddling with the Z-index but that hasn’t done anything. I would really really really appreciate any help someone can give me