Return to previous page

Mega menu space around the items and items background

This topic has 5 replies, 2 voices, and was last updated 1 years, 7 months ago ago by Tony Rodriguez

creativesite

Participant

May 1, 2023 at 19:03

Hi,
can you please help in:

1. How could I squeeze the space above and under
the items in Mega Menu, 2 columns?

2. And how could I set the background on hover of the items when using Mega menu?

https://postimg.cc/8sjf1DZk

Thank you in advance!

#355056 Copied Theme version: 9.1.2 WooCommerce version: 7.6.1

4 Answers
Tony Rodriguez

Support staff

May 2, 2023 at 08:27
Hello, @creativesite,

1. We kindly request that you copy and paste the following CSS code into XStore >> Theme Options >> Theme Custom CSS >> Global CSS and then clear your browser cache to view the changes.

The result should look like the image provided: https://postimg.cc/Z9QKsr1K
```
.nav-sublist-dropdown ul li {
    margin-bottom: 0px !important;
    padding-bottom: 15px !important;
}
```
2. To set the background on hover of the items, please copy and paste the following CSS code into XStore >> Theme Options >> Theme Custom CSS >> Global CSS and then clear your browser cache to view the changes:
```
.item-design-mega-menu.columns-2 .nav-sublist-dropdown .container>ul>li:hover {
background-color: green !important;
}
.item-design-mega-menu.columns-2 .nav-sublist-dropdown .container>ul>li:hover a {
color: #fff !important;
}
```
We thank you for your cooperation and remain at your disposal.

Best Regards,
8Theme’s Team.
#355092 Copied
creativesite

Participant

May 2, 2023 at 14:23

Hi Tony,

Thank you.
Unfortunately the padding and background is not so perfect now, it looks like this:
https://postimg.cc/WFPYR2m2
https://postimg.cc/XZ51DZCH
https://postimg.cc/fJHP3QsK

Can you please help?
Thank you!

Please contact administrator
for this information.

#355153 Copied

creativesite

Participant

May 3, 2023 at 13:49

Hi Tony,
can you please help on this?
The Secondary menu is a Megamenu and its dropdown items look a bit weird now.. I think changed the paddings somewhere and its background it too small, and the items are a bit too far from each other.

Thank you!

Please contact administrator
for this information.

#355304 Copied
Tony Rodriguez

Support staff

May 4, 2023 at 06:51
Hello, @creativesite,

We kindly request that you copy and paste the following CSS code into XStore >> Theme Options >> Theme Custom CSS >> Global CSS and then clear your browser cache to view the changes.
```
@media only screen and (min-width: 993px){
.item-design-mega-menu.columns-2 .nav-sublist-dropdown .container>ul>li {
    margin-bottom: 0px !important;
    padding-top: 10px !important;
    padding-bottom: 8px !important;
}
}
.et_b_header-menu .nav-sublist-dropdown .item-link:hover {
    opacity: 1 !important;
}
```
Kind Regards,
8theme team
#355384 Copied
Tagged: background, items, mega menu, space, themes, woocommerce, wordpress
Viewing 5 results - 1 through 5 (of 5 total)