Docs

[addwirecom]

Hi, I’ve been searching everything, and so far it’s been fruitful. However this i’m wondering about. In the Mega Menu’s that’s I’m adding, I want to reduce the space between each child option, as seen in the screen shot.

vapor-workz.com

What Can I add in the CSS to redice the amount of space between each option?

[Thai]

Hi There,

Please add the following CSS under Customizer > Custom > Global CSS:

.desktop .x-nav .x-megamenu>.sub-menu>li>.sub-menu>li>a {
    padding-top: 2px;
    padding-bottom: 2px;
}

Hope it helps 🙂

[addwirecom]

Thanks, it did. It’s hard to find which is the best selector.

I noticed that the hover isnt’ functioning,

Can you tell me the css to change the color of the hover of these child menu’s, lets say the color: rgb(175,33,43) for example.

Thanks!

[Rad]

Hi there,

Sure, you can add something like this,

.desktop .x-nav .x-megamenu>.sub-menu>li>.sub-menu>li>a:hover {
color: rgb(175,33,43);
}

Or if you wish to change the entire sub menu items color upon hover of the parent, then this should do it too

.desktop .x-nav .x-megamenu>.sub-menu>li:hover>.sub-menu>li>a {
color: rgb(175,33,43);
}

Cheers!

[addwirecom]

Thanks, the CSS did not work. However, what worked was:

.navmegch > a > span:hover {
  color: rgb(175,33,43);
}

Thanks!

[Rad]

Glad to hear that 🙂 Cheers!

[Author]

Posts