Archived topic
Arrow on Menu Drop Downs
11 replies · Started by Anonymous on February 12, 2016
Hi Tom,
If I nest a menu item under another on my main nav bar, it makes a little arrow appear. I assume this is just to indicate that there is more under this option.
Is there a way to disable or remove this arrow?
Absolutely - just add this CSS:
.menu-item-has-children .dropdown-menu-toggle {
display: none;
}
.main-navigation .main-nav ul li.menu-item-has-children > a {
padding-right: 20px;
}
Thanks a lot, Tom!
I have asked the same question last year, but when I update GP and addons to the newest version, the arrows re-appear.
Now the problem solved. However, how can I enable arrows in sub-menu?
Try this:
ul ul .menu-item-has-children .dropdown-menu-toggle {
display: block;
}
.main-navigation .main-nav ul ul li.menu-item-has-children > a {
padding-right: 0;
}
Let me know :)
Solved.
It works great. Thank you, Tom!
You're welcome :)
I just got around to getting back to this. Sorry for the late reply.
Thank you for the help, Tom! This will work perfectly. :]
No problem! :)
Hello Tom, how can i remove dropdown menu arrow also in mobile menu?
Thanks,
Jörg
Try this:
@media (max-width: 768px) {
.main-navigation .menu-item-has-children .dropdown-menu-toggle {
display: none;
}
}
I wanted to remove just the dropdown arrows from the nav menu and it worked with this code:
.menu-item-has-children .dropdown-menu-toggle {
display: none;
}
.main-navigation .main-nav ul li.menu-item-has-children > a {
padding-right: 10px;
}
However, it removes the dropdown menu all together on tablets and mobile devices. I just want to remove the arrows on all devices keeping the dropdown menu.
Any chance you can open a new topic and link me to the site in question?
Thanks :)