Hide a fixed logo beneath a scrolling div

Question

I have a design to build that calls for a fixed-position logo and a nav bar that scrolls with the page. As the nav bar goes over the logo, the logo begins to hide. I have spent a lot of time on this and it's quirky at best. Wanted to throw this out to see if maybe there's a simpler solution that I'm missing. Thanks!

Answer 1

That's may be because of your logo's z-index issue. If you can increase z-index for your logo it will stay on top always. For example if there is logo class with .logo your code will look like.

.logo { z-index: 99999 }

You can use that value according to your own needs, hope that makes sense.

Answer 2

如果 logo 有一个固定的位置（或者如果它在 CSS 中有一个position值），您可以使用z-index值将其放置在某些元素的上方或下方。