How to customise spacing between menu items in the WoodMart menu element
-
I would like to decrease the spacing between menu items in the WoodMart menu element. I have tried to select, “Custom” under, “Gap” and add my own spacing but it would not reflect, even if I punched in 0. I have also tried to configure the padding but this does not work as well. I have pasted a link and attached a screenshot below. Have a look and let me know how I can solve this issue.
Attachments:
You must be
logged in to view attached files.
Hello,
Could you please share the URL of the page where these menu items are displayed which you showed in screenshot, along with your WP-Admin login details in the Private Content field? We will check the menu settings on your website and suggest a possible solution.
Best Regards
See attached items below.
Hello,
I have checked your website and found that the menu widget is added inside the mega menu. In the widget’s Style > Items settings, the spacing is currently set to Small, which is the minimum predefined option.
To reduce the spacing further, you can try adding the following CSS under Theme Settings > Custom CSS > Global:
/* Target and reduce vertical spacing in WoodMart vertical menu widget */
.wd-nav-vertical.wd-design-simple,
.wd-menu .wd-nav-vertical {
--nav-gap-v: 0px !important;
--nav-gap: 0px !important;
}
.wd-nav-vertical.wd-design-simple > li > a,
.wd-menu .wd-nav-vertical > li > a {
padding-top: 2px !important;
padding-bottom: 2px !important;
line-height: 1.2 !important;
}
.wd-nav-vertical.wd-design-simple > li,
.wd-menu .wd-nav-vertical > li {
margin-bottom: 0px !important;
}
Best Regards
.
