Archived topic
Main navigation menu formatting
11 replies · Started by David on May 24, 2017
Hi
i followed one of the earlier posts regarding the formatting of the main menu.
I have used the prescribed CSS to remove the downward arrow for menus with children:
/* format menu main nav bar*/
.menu-item-has-children .dropdown-menu-toggle {
display: none;
}
.main-navigation .main-nav ul li.menu-item-has-children > a {
padding-right: 20px;
}
Well the arrow disappears but the padding to make up for its absence doesn't work?
Any ideas.
Hi David,
Can you provide a link to your site so we can take a look? Thanks!
Hi Leo
ill send link across email
thanks
David
I see the code working but it's only 10px.
Change it to 30px then it should be even on both sides.
Let me know.
Hi Leo,
sorry it doesn't work - even if i put 500px in the padding it still doesn't change ;)
David
Are you using any caching plugin? Try clearing your browser cache?
I can see the 10px padding on the right working.
Hi Leo,
no caching plugin just opcache on the server. cleared local cache didn't change. however tried it on windoze and its all good. i think my mac needs some caffeine - ill give it a reboot and see what the result is. Sorry to waste your time.
Of course while your there, is there an easy way of putting underlines below the menu items on hover and when active?
regards
David
No worries :)
I find this is cool for menu underline: https://generatepress.com/forums/topic/animating-link-underlines-for-main-menu/#post-200801
Let me know if that works for you.
Hi Leo
thank you - thats some pretty funky code from Luiz. I may spend some time getting my head round how it works!
Much appreciated.
Case resolved x2!
David
To be honest I'm not sure how it works either ;)
Just copy and paste the whole thing then you should see the result :)
Glad I could help!
Lol
i think got my head around it a little - and has just helped me simplify some of my own CSS transforms!
Awesome!