Hi,
I would like to customize a few things about my sub-menu and can’t figure out how to do so. I found a previous thread that explained how to alter the padding around menu items, so I currently have this included in my custom CSS:
.main_menu ul:first-child > li > a{
padding: 0 25px !important;
}
Because the padding has been changed, the text in my sub-menus no longer align with the parent text in the main menu. I would like for these to shift to the right so that the text is aligned on the left all the way down. In addition to the alignment issue, I also want to widen the container of the submenus so that the text does not wrap as it does currently. Lastly, I want to be able to change the font style and size of the sub-menu items but can’t figure out which class or ID to adjust the CSS for.
Thanks in advance for your help!
Hey katelynkingtaylor!
try this code to align (left value) and to widen (width value) your submenu:
.av-main-nav ul {
left: 18px;
width: 250px;
}
and adjust as needed.
For font-size of your submenu use this code:
ul.sub-menu .avia-menu-text {
font-size: 10px;
}
Cheers!
Andy
Thank you!! Works perfectly.
One last question – how do I adjust the line spacing between the sub-menu items? I want them to be closer together as if it is single spaced not double spaced.
Thanks again!
Hey!
Add this.
.sub-menu a {
padding: 2px 15px !important;
}
Increase the 2px to make them bigger.
Best regards,
Elliott
That’s exactly what I needed. THANK YOU!!
You can mark as resolved.