Navbar Menu / Submenu Alignment

Support
#1

Hi Support,

I am having trouble with my sub menus in the main menu. They appear too far to the left when hovering. I would like them to be directly underneath their parent.

My web site address is http://westsidevirtualwebdesign.com

I searched the forums, and found that if I add the CSS property,

right: -43%;

it aligns correctly, but the white background with lines still stays to the left.

Can someone please help?

Thank you in advance as always.
Pam

#2

Hello @WestsideVirtual,

Thanks for writing in!

Please add following CSS to change sub menu alignment:

.masthead-inline .x-navbar .desktop .sub-menu {
    left: -10px;
    right: auto;
}

You can change corresponding value as per requirement.

Let us know how it goes.

Thanks.

2 Likes
#3

Hi Prasant,

That worked perfectly, thank you so much.

One more question related: is there a way to close the gap - or reduce the height of the gap - between the navbar menu and the first row of the sub menu?

Thanks again for your excellent support.

#4

Hi again,

Please add the following code in your Customizer as well:

.x-navbar .desktop .x-nav > li ul {
    top: 65px !important;
}

Let us know how this goes!

1 Like
#5

Hi Nabeel,

Thank you so much, that worked perfectly.

Thank you again for your kind assistance.

You can close this thread.

#6

You are most welcome. :slight_smile: