[Resolved] Sub Menu Dropdown Arrow Positioned Incorrectly

[Anthony]

I can’t seem to figure out why the dropdown arrow is lower on my submenu here.

https://gsparcel.com/

Under Products > Other. The arrow next to “Other”, seems to be a bit low?

Thanks

[Ying]

Hi Anthony,

It’s because of this CSS you added:

.main-nav .gp-icon svg {
    color: #6ea1ce!important;
    height: 2em!important;
    width: 2em!important;
    top: 0.55em!important;
}

The SVG icon was 1em x 1em by default, you changed it, so it’s not align with the text anymore.

Try adjust the top value 0.55em to maybe -0.3em?

[Anthony]

When I change the Top value it moves the main menu dropdown arrows as well. Can I just adjust the sub-menu dropdown arrow?

See here: https://snipboard.io/b6CWae.jpg

[David]

Hi there,

change your CSS to:

.main-nav .dropdown-menu-toggle .gp-icon svg {
    color: #6ea1ce!important;
    height: 2em!important;
    width: 2em!important;
    top: 0.55em!important;
}

That will apply only to the dropdown toggles

[Anthony]

Thank you!

[David]

You’re welcome

[Author]

Posts