When hover on the menu then select a link, the hover menu disappear when moving the mouse

Hello fellow shopifyiers,

I am new to shopify and I am trying to fix a problem for couple of days now and hope you guys and direct me to a solution.

The problem is when you hover on the menu either Shop or Support, when trying to select a link, the menu will disappear. I have no idea what it’s causing the problem. I tried some solution from shopify such as adding top:30px to the .site-nav__dropdown or adding the display: block; to the .site-nav–has-dropdown:hover .site-nav__dropdown,.site-nav–has-dropdown:focus .site-nav__dropdown. Still with no success.

I hope you can try to help me and fix the problem.

Here is my website: https://astrohike.com

Password: 1

Sincerely,

Hi @Kyaroruk
You can try follow this path:
Themes => edit code => asset => wonify.scss.liquid
and add this code to bottom of the file wonify.scss.liquid

.site-header > .page-width{
position: relative;
z-index: 30;
}
1 Like

Thank you so much, it’s working :slightly_smiling_face:

Really appreciate.

Sincerely,

After triple checking, it’s working perfect on desktop but on mobile it overlap :disappointed_face:

Hi @Kyaroruk
add this code into the bottom

.drawer{
z-index: 69;
}
1 Like