Z-index of header builder

[mcaravaglia]

Hello. Please see attached capture.
I have a client that wants a yellow bar to drop-down, like a window shade, whenever the “Contact” menu item is hovered. I have done this with a JavaScript animation. My issue is that the yellow bar drops down in front of the Nav bar and I need it to slide down from behind the bar. I have been unable to achieve this in the Header Builder.

In the Header Builder, the Bar has a default z-index of 9999, which places it above everything else. Even when I set the Z-index of my yellow bar to a lower number, it still appears on the top. I am rather perplexed by this. Any thoughts you have would be greatly appreciated.

Thank you.

[mldarshana]

Hi There @mcaravaglia,

Thanks for writing in! I have checked your website that is on your screenshot, but I see that you have enabled under construction mode.

You need to check your other elements around that bar as well and check their Z-index values. You can also set them to 0 (for those other elements around) and test your issue further.

Please make sure to clear all caches when testing your issue (https://www.wpbeginner.com/beginners-guide/how-to-clear-your-cache-in-wordpress/).

If you’re still having issues, disable your under construction mode temporarily and share your page URL to check your issue further.

Thanks!