Homepage menu has box-shadow under submenu's parents

I’m surprised I couldn’t find an answer for this as it’s pretty common practice to have a menu item that’s unclickable because it’s just the parent of a submenu.
On my homepage, the main menu shows the “active page” box shadow under all of the parent menu items, because their URL is the same.

I would like to have the box-shadow show on the actual current page still though.
When I add this though, then it removed the box-shadow from the actual “current menu item” and only shows on hover.

.x-navbar .desktop .x-nav > li.current-menu-item > a > span {
box-shadow: none;
}

What’s the workaround for this? Just add that CSS on the homepage CSS (since this only affects the homepage) and deal with no shadow there, but it will at least be there on all the rest of the pages?

http://dev.thehelpfulmarketer.com

Hi there,

Unfortunately, I could not see the effect you are talking about. The home menu has the box shadow and other parent items do not:

Would you please give us more detailed information on how you want to have the menu items box shadow act?

Thank you.

So strange!
I even tried it in Firefox, where I had never visited the site before, and it was doing it there too.
Now it’s not doing it anymore.
Well I’m glad it magically fixed itself!

Hello @a_buzon,

Thanks for updating the thread. :slight_smile:

Yes, I also tried on my end and it seems to be working fine. Here is a screenshot. https://cl.ly/0S3K0t2r3r14

Glad the problem is fixed now. :slight_smile:

Thanks.

1 Like

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.