For some reason - potential edits to code - the dropdown navigation on the header is now not showing on the homepage, but will show in products page but it is hidden behind the page banner. How can I rectify this. Screenshot and URL provided:
Topic summary
A Shopify store owner reports that dropdown navigation menus in the Dawn theme are malfunctioning: they don’t appear on the homepage and are hidden behind page banners on product pages.
Proposed Solution:
One respondent suggests this is likely a z-index CSS conflict and recommends adding positioning code to the header element:
.site-header {
position: relative;
z-index: 9999;
}
Current Status:
Another user reports the site works fine for them, suggesting the issue may be browser-specific or intermittent. A third user attempted the CSS fix in the Origin theme’s base CSS file without success, indicating the solution may need adjustment or the problem has a different root cause. The issue remains unresolved.
It sounds like there may be a z-index issue with your header and page banner. You can try adjusting the z-index value for your header in your theme’s CSS to bring it to the front and make it visible.
Here’s an example of what the code may look like in your theme’s CSS file:
.site-header {
position: relative;
z-index: 9999;
}
Hi, I’m using the “Origin” theme. I’ve pasted the code in the base.css file at the bottom but it doesn’t do anything. Can you help?