removing arrows from main navigation menu

I use the following CSS to remove the carat symbols from the primary Nav. The second half of the code is used to add padding to make-up for the missing symbols to re-center your menu names.

.menu-item-has-children .dropdown-menu-toggle {
    display: none;
}
.main-navigation .main-nav ul li.menu-item-has-children > a {
    padding-right: 30px;
}

Adding CSS to GeneratePress

works like a charm ;)

thank you

Your welcome

Hi David,
this post was really helpful. Thanks a lot.

Just one more question to this:
How can I remove the arrows in the top menu but still have the arrows for the submenu activated?

Thank you for your help!

Hi there,

Try change this CSS:

.menu-item-has-children .dropdown-menu-toggle {
    display: none;
}

to:

.main-navigation .main-nav > ul >li.menu-item-has-children  .dropdown-menu-toggle {
    display: none;
}

Hi Ying,

sorry but it didn't work. Any other suggestion or ideas?

Hi there,

can you raise a new topic where you will have access to the Private Information field, and in that share a link to your site so we can see whats going on