Docs

[peadar]

Hello, how can I get the submenu items to display on a single line.

The attached images shows how each submenu item is displaying on multiple lines rather that one line per item.

Thanks in advance, I look forawrd to hearing from you.

Kind regards,

Peter

[Paul R]

Hi Peter,

To make it one line, you can add this under Custom > Edit Global CSS in the Customizer.

.desktop .sub-menu .sub-menu {
    width:400px;
}

You may change 400px to adjust the width of sub menu.

Hope that helps

[peadar]

Hello, that doesn’t seem to do it.

When I click ‘inspect’ and copy the outer html on the menu item highlighted in the picture I get the following;

<span class=”ubermenu-target-title ubermenu-target-text”>Bright Water Landscape Partnership</span>

Clicking ‘copySelctor’ I get the following;
#ubermenu-nav-main-21-primary > li.ubermenu-item.ubermenu-item-type-post_type.ubermenu-item-object-page.ubermenu-item-has-children.ubermenu-item-23447.ubermenu-item-level-0.ubermenu-column.ubermenu-column-auto.ubermenu-has-submenu-drop.ubermenu-has-submenu-flyout > ul > li.ubermenu-item.ubermenu-item-type-post_type.ubermenu-item-object-page.ubermenu-item-has-children.ubermenu-item-23493.ubermenu-item-auto.ubermenu-item-normal.ubermenu-item-level-1.ubermenu-has-submenu-drop.ubermenu-has-submenu-flyout > ul > li.ubermenu-item.ubermenu-item-type-post_type.ubermenu-item-object-page.ubermenu-item-29246.ubermenu-item-auto.ubermenu-item-normal.ubermenu-item-level-2 > a > span

Does that make it clearer?

Thanks again.

Kind regards,

Peadar

[Thai]

This reply has been marked as private.

[peadar]

This reply has been marked as private.

[Rupok]

Hi there,

Thanks for the credentials. Let’s try this :

.ubermenu .ubermenu-item .ubermenu-submenu-drop {
  min-width: 350px;
}

If you need more width then just change the value.

Cheers!

[peadar]

Brilliant, how could I amend it so that the width of the first dropdown isn’t affected? (see pic)

Thanks again.

Kind regards,

Peadar

[Rupok]

Hi Peadar,

Thanks for writing back. In that case you can add the code like :

.ubermenu .ubermenu-item .ubermenu-submenu-drop .ubermenu-submenu {
  min-width: 350px;
}

Cheers!

[peadar]

🙂 great support as always!

Thanks, Rupok.

Peadar

[Christian]

You’re welcome.

[Author]

Posts