Home div element gets transparent while scrolling while using the position:sticky in css

Questions

div element gets transparent while scrolling while using the position:sticky in css

April 25, 2023

hi i am having a css object which has position set as sticky so that it stays when scrolled.But when it traverses above other elements like li tags it gets transparent.

.nav-menu{
width: 400px;
height: 62px;
left: 0px;
top: 0px;
opacity: 1;
position: sticky;
background-color:#0C5061;
}

i have tried using opacity:1 for the elements but it doesn’t seems to work.what else can be done?

>Solution :

It’s likely that your menu is behind/under the scrolling content. Try setting z-index: 99. (99 is arbitrary here. 1 might also work, depending on whether you have other content with z-index.)