after update to 6 version menu line high is too hight

Good morning,
after update to version 6 my menu line high is too high. This was a problem that also previus version has and you have solved with this code.
body .menu-main-navigation-container .menu-mega-dropdown .sub-menu>li {
margin-bottom: 5px;
}
But now this code doesnt work anymore.
Can you give me new code that works with version 6?.
I have sent to you two images. The right one is about production site with till version 5, the wrong one is about staging site where I have update template to version 6.
Thank a lot in advice.

Elisabetta

Attachments:

You must be logged in to view attached files.

Hi,

Try to replace previous code with following one:

body .wd-nav-main .menu-mega-dropdown .sub-menu > li {
	margin-bottom: 5px;
}

Kind Regards

Good morning,
thank you for your answer.
The code you suggest works halfway. Menu voice doesn’t break but stay on the same line so menu looks misaligned. I have attach an image.
Thank a lot in advance for your solution.
Elisabetta

Attachments:

You must be logged in to view attached files.

Try to replace previous code with following one:

body .wd-nav-main .menu-mega-dropdown .sub-menu > li {
	margin-bottom: 5px;
	min-width: 220px;
	max-width: 220px;
}

Kind Regards

Thanks you a lot, this one works fine.
Elisabetta

Excuse me I need another help,
font size is too large into the menu, I suppose it is 14px, How can I reduce it to 12px?
Thanks for your solution

Try to add the following code snippet to the Custom CSS area in Theme Settings.

body .wd-nav-main .menu-mega-dropdown .sub-menu > li > a {
	font-size: 12px;
	font-weight: 400;
}

Kind Regards

thanks a lot, its works!

Fantastic support!

You are welcome!

Good afternoon,
the problem to solve is always about menu lines. The menu lines are very far apart, is it possible to bring them closer and leave less white space between one line and another?
thanks a lot in advance
Elisabetta

Hello,

Please add this code to the Theme Settings > Custom CSS > Global:

.wd-nav-main .wd-sub-menu li a {
    padding-top: 3px;
    padding-bottom: 3px; 
}

This code reduces this gap: https://prnt.sc/139af3x

You can change 3 into less or more value.

Best Regards

Good morning,
I need to decrease space between menu lines like show in the attached image. The code that you have send doesn’t solve the problem.
Thanks in advance.
Elisabetta

Attachments:

You must be logged in to view attached files.

Hi,

1. Try to use following code to change dropdown frame paddings on all sides (https://prnt.sc/13c7e8f). You can change any value in this code to the desired one.

body .wd-dropdown-menu.wd-design-sized, 
body .wd-nav-vertical .wd-dropdown-menu.wd-design-full-width {
	padding-top: 25px;
	padding-left: 20px;
	padding-right: 20px;
	padding-bottom: 10px;
}

2. Try to use the following code to change vertical spacing between dropdown menu items (http://prntscr.com/13c7rea). You can change any value in this code to the desired one.

body .wd-nav-main .wd-sub-menu li a {
    padding-top: 5px;
    padding-bottom: 5px; 
}

Code for menu item spacing is the same from the previous reply. This code is correct and should work properly. If you add it to your Custom CSS area and nothing changed, please leave it on your site and provide us with admin access, so we can login and check why it is not working.

Kind Regards

Thanks a lot, now it works fine

You are welcome! If you have any questions please feel free to contact us.

Best Regards

[Author]

Posts