Z-Index help?

Support
#1

My client wants their logo to descend below the menu bar, and would like the sub menu to show up in a second bar below that. I have the site working visually, but the z-index of the logo seems to prevent the sub menu from receiving the focus.

You can see what I mean at http://dev.mightysparkfood.com. Hover over a menu item, then descend to the sub menu. The cursor does not change to a hand until you get below the bottom of the logo.

Perhaps this is more a general CSS question rather than a specific X-Theme question, but can you offer any advice?

#2

Hi There @kb0wwp

Thanks for writing in! Could you please try adding the following CSS rule into your X-> Theme Options -> CSS area and see if that helps.

.desktop .sub-menu {
    z-index: 9999 !important;
}

Thanks!

#3

That didn’t quite do it. You can see what that does - it hides the bottom of the logo when the sub menu pops up.

#4

Hi there,

Please also add this code:

.x-brand {
    z-index: 999999;
    position: relative;
}

Here are some related links for further reading:

Hope this helps.

#5

Perfect, thank you!

#6

You are most welcome. :slight_smile:

#7

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