Center Ubermenu Submenu Items

Hi,

I am trying to center the submenu items in a megamenu. The menu in question is the SHOP link at https://www.mindbodymanagement.co.uk. The submenu headers are centred, but I cannot find a setting to centre the bottom-level menu items.

In addition, I am trying to add a horizontal divider line to the megamenu submenu items, just like the dividers you can see under the PROGRAMMES & FEES menu.

I would appreciate any help with these two issues.

Thanks,
Christopher

Hello Christopher,

Thanks for writing in!

1.) To center the submenu items, you will need to set the submenu widths correctly and make sure that the submenu width is appropriate for your submenu. You can check out this documentation:

2.) The dividers are just simple borders. Please check your settings in Appearance > Ubermenu > Main UberMenu Configuration > Style Customizations

Please check out this documentation:

Hope this helps.

  • General Settings

Thanks. I have the layout sorted out. However, the item dividers in megamenus I cannot resolve. There is an item divider setting for Normal/Flyout items, but these do not seem to affect megamenus. Have a look at the THERAPIES submenu (megamenu mising dividers) compares to the PROGRAMMES & FEES menu which is a standard flyout menu, which has dividers.

Thanks,
Christopher

Hello Christopher,

To add the borders to your mega menu, please add the following CSS code in the X > Theme Options > Global CSS (http://prntscr.com/evui3r)

.ubermenu-main .ubermenu-submenu-type-mega .ubermenu-item-normal .ubermenu-target {
    padding-top: 10px;
    padding-bottom: 10px;
    border-bottom: 1px solid #ffffff;
}

We would love to know if this has worked for you. Thank you.

Thank you! Absolutely perfect.

Glad we could help.

Cheers!

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.