Hi,
We are trying to align the submenu items on a 3 column mega menu and not having much success. Just a few of the submenu items in columns 2 and 3 are a little off and we can’t figure out why. We’ve already tried the css below to no avail. Your input would be appreciated. Link to the website is under private content. Thank you.
#top #header.av_minimal_header .avia_mega_div {
left:auto!important;
right:0!important;
}
span.mega_menu_title a {
text-align: left!important;
}
Hey GWS,
Best regards,
Victoria
Hey, Victoria–
Thanks for the quick response. I thought it looked fine, also. But the first letter of each doesn’t line up as you can see in the dropbox file (link in private content). We drew a line down each column and it shows a spacing issue before some of the menu items. What do you think?
Hi GWS,
Hmm… weird, not sure the code you added can do anything here. And not sure why it is happening. Maybe it happens because some text is overflowing the li element and so pushes the next element to the right.
Best regards,
Victoria
Thanks, Victoria. You pointed me in the right direction. I increased the width through custom css and that aligned the list items in the submenu. Let me know if there is a better approach, but it looks good on different size screens. Mega menu isn’t used on mobile/tablets, so no worries there. Thanks, again and have a good day.
#top #header .avia_mega_div .sub-menu {
width: 110%;
}
Hi,
Thanks for the feedback. If your CSS is working then I you don’t need to do anything else :-)
Please let us know if you should need any further help on the topic or if we can close it.
Best regards,
Rikard
Everything is working great. Feel free to close this topic. Thank you.
Hi,
Glad we could help!
Please take a moment to review our theme and show your support https://themeforest.net/downloads
Don’t forget to bookmark Enfold Documentation for future reference.
Thank you for using Enfold :)
Best regards,
Basilis