[Resolved] Nav. Menu – right padding missing on menu items with sub menus

[Monika]

Hi there,
I’m noticing that the main navigation menu does not add any padding to the right of the menu item when there are sub menu items present. I’m linking to a screen shot for illustration.
Would you kindly help me with adjusting this?

Thank you!

Kind regards,
Monika

[Leo]

Hi there,

I assume you added CSS to remove the dropdown arrows?

If so you need to add the padding as well: https://generatepress.com/forums/topic/arrow-on-menu-drop-downs/#post-172450

Let me know if this help.

[Monika]

Actually, I didn’t add the css to remove the arrows. I did, however notice double arrows a while ago and saw that they were coming from the ‘Stylepress’ plugin, an Elementor add-on plugin… and then someone gave me this css, which fixed it:
.main-navigation .main-nav ul li a,
.menu-toggle, .main-navigation .mobile-bar-items a {
line-height: inherit;
padding-top: 10px;
padding-bottom: 10px;
}

In the meantime I actually deleted the Stylepress plugin and also – just now – deleted the above quoted css.

However, no changes…. and yes, I updated the file.

Any ideas?

Thank you.

[Leo]

Any caching plugin?

If not something is definitely hiding it as GP adds the dropdown arrow to menu items with submenu by default.

I also don’t see how that CSS would’ve hidden the dropdown arrow.

Can you link me to the page?

[Monika]

Hi Leo,
I don’t know a lot css, but I was also surprised that this worked… but strangely it did.
I currently have the caching plugin not activated – during development.
Here is the link to staging site…the same issue is happening there, but I noticed that on my local site, the padding on the bottom is even less.The staging site still has that above mentioned css snippet.

http://www.staging.humuh.org/

Let me know if you need admin access to the site?

Thank you for your assistance.

Monika

[Leo]

Looks like this CSS is added in the Additional CSS field:

.dropdown-menu-toggle:last-of-type {
    display:none
}

[Monika]

Oh my gosh, I don’t even remember it all… but it is hazily coming back now… can you possibly tell me where I would have entered this? Thanks.

[Leo]

Check the Additional CSS field in the customizer: https://docs.generatepress.com/article/adding-css/#additional-css

[Monika]

Found it – have removed all the additional css – thank you! Now I need just a bit of padding underneath the menu… check it out:
http://www.staging.humuh.org/

[Leo]

Try adjusting the menu item height and width: https://docs.generatepress.com/article/menu-item-height-width/

[Monika]

You know, I have two lines in my top navigation menu. When I go to adjust the Menu Item height according to the documentation you gave me the link for (above)it only adjusts the height BETWEEN the two lines, but not the padding or height from the bottom of the menu bar. Go figure!
The strange thing is that up until recently this all worked fine and had enough padding. I don’t know what made it change. Any ideas?
Thank you for your support.

Regards,
Monika

[Leo]

Hmm try this: https://generatepress.com/forums/topic/css-line-break-menu/#post-202661

[Monika]

Yay! That did the trick. Thanks a lot Leo .. .and Tom… I keep praising your tech support to everyone who wants to hear it. 🙂

[Leo]

No problem! Glad we’ve been helpful 🙂

[Author]

Posts