Navbar going under content

Hi there,
I am trying to make my navbar not sticky however have it overlap the content that it goes over, to look a bit like this:

However, this issue with this is that the header is now sticky, but when I disable it being sticky, it does this:

This wouldn’t be an issue if it overlayed on top of the other content, however, when I add a negative margin (no matter which element it is on - navbar or the content below), it is always put underneath the content, like this:

Does anyone know a fix to this, I have been at this for a while now trying to get it to work and I just can’t seem to find the way.

Thanks in advance,

have you changed the z-index of the contents? could be worth adding z-index:9999999 to the navbar and see if that solves it

You can look at the code I used on this site. I think it does what you want.

Thank you all for your replies!

Is anyone able to tell me how to make @kuligaposten one fade in when you scroll, please?