As the title suggests, my sticky header and also the mega menu are hiding behind most elements on my website www.ellaywatches.com The mega menu is hidden behind the main banner on my website and the sticky menu follows you as the scroll the page but is being placed behind other sections of my website, whether it be an image, text block or anything else for that matter. This problem has only just started and the only new addition to my website is an app that allows a stick cart button on my product pages.
Any one who can shine some light on this issue will forever hold a special place in my heart
This is a styling issue, whereby the navigation is not set to be the top most layer.
There is an app or a setting somewhere in the theme that has this CSS style applied to the main part of the website:
#main { z-index:99; }
this is basically making the body of the website the top layer. In relation the navigation is set to z-index:4;
so it will always display underneath something with a z-index of 99.
Doing a page source preview, the problem certainly lies within that app stick cart button you mentioned as shown by this piece of code:
Not sure, if you can contact the developer to remedy this bug, or if there is a setting within the app to add your own custom settings, but setting this z-index to 0 or 1 will fix the issue.
Want to thank you for your response. You were of course completely correct about the issue causing this problem and the app developer has fixed the issue. So everything is working as it should. Appreciate you taking the time to help us out.