Help with dropdown menu

Hi. My dropdown menu is working fine on desktop but when the menu is on two rows and i open a submenu then the main menu items are showing on top of my dropdown menu. As you can tell in the picture there’s one menu item and one submenu item over each other and when trying to click on the submenu item it actually clicks on the main menu item. I want my dropdown block to cover everything below it without my main menu showing up on it. i’m using horizon theme. Website: https://seoul-sound.myshopify.com/

Hey @Tilda_Falth

I just checked and your menu looks all fine to me. You can see below

Best,
Moeed

Thank you for answering! I’m talking about when the screen is in between desktop and mobile in size, like on an

ipad.

Hey,

I see the issue. In fact this issue is not on Mobile. It’s on Tablet view not in the Mobile view. Let me check that properly and provide you the solution.

Hey @Tilda_Falth

Follow these Steps:

  1. Go to Online Store
  2. Edit Code
  3. Find theme.liquid file
  4. Add the following code in the bottom of the file above </ body> tag
<style>
li:has(a#HeaderMenu-om-seoul-sound) {
    z-index: 0 !important;
}
</style>

RESULT:

If I managed to help you then a Like would be truly appreciated.

Best,
Moeed

Thank you so much!‎‎ ‎‎‎‎‎