Menu Dropdown links going to image behind it

Topic summary

A menu dropdown issue occurs where submenu links redirect to a hero image banner link positioned behind them, but only on the homepage. Links over the hero image fail to work, while those not overlapping function correctly. The problem also only affects the homepage—other product pages work fine.

Solution provided:

  • Navigate to section-image-banner.css in the theme code editor
  • Locate the .banner--adapt_image.banner--mobile-bottom CSS rule
  • Remove z-index: 0; from the styling to fix the layering conflict

This CSS adjustment resolves the z-index stacking issue, allowing the dropdown menu to appear above the banner image. The original poster confirmed the fix worked.

Open issue: One user reports the solution doesn’t work for the “Origin” theme, suggesting theme-specific variations may require different approaches.

Summarized with AI on November 6. AI used: claude-sonnet-4-5-20250929.

Hi, looks like my menu dropdown is going to the hero image banner link behind it on the homepage. The first link in the submenu that is not over the hero image behind it works, but the links below do not work.

The issue seems to only be on the homepage as the links are accessible from the other product pages.

https://www.greatgiftandpaper.com/

Thanks!

Hi @cw123

The problem with the menu link is broken because the image below the menu is above the submenu.

You can do it my way.

Go to edit code >> file section-image-banner.css and then find the code below:

.banner--adapt_image.banner--mobile-bottom .banner__media:not(.placeholder) {
  height: auto;
}

then replace them with the following code (add z-index: 0);

.banner--adapt_image.banner--mobile-bottom .banner__media:not(.placeholder) {
  height: auto;
  z-index: 0;
}

We hope our suggestion can help you.

2 Likes

awesome this worked! Thanks!

Hi @cw123

We’re happy to see that our suggestion helped you solve the issue. Can you kindly give us a like and mark it as a solution? This can be a reference for other merchants if they have an issue like you.
Thanks in advance.

Thank you so much!

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?