Text in dropdown menu smaller

petitpoisvideos · Member · Apr 13, 2021 at 7:20 am
Copy link

Add topic to favorites
Hi

Can someone please give me a CSS snippet to have the text in dropdown menu
display smaller than main menu?

And also, it would be ok to have the main menu text smaller as well.

Thanks

The blog I need help with is: (visible only to logged in users)
a18s · Member · Apr 13, 2021 at 7:42 am
Copy link
@petitpoisvideos Hi there,

Try the following code:

.main-navigation .sub-menu { font-size: font-size: 0.875em; /* 14px/16=0.875em */ }

Hope this helps!
petitpoisvideos · Member · Apr 13, 2021 at 7:50 am
Copy link
Thank you, that was quick!!

So if I should want the drop down text to be even smaller than the main menu, which number should I change?
(14 – to say 12?)
petitpoisvideos · Member · Apr 13, 2021 at 8:29 am
Copy link
Hello again,

I tried different settings in your code, but it didn’t seem to change font size of the drop down menu. Tried figure things out by going to W3schools, filling in what I could find relevant, – no luck.
Other suggestions?
staff-mckluskey · Staff · Apr 13, 2021 at 9:14 am
Copy link
Hi there!

Try this piece of code:
```
/* Menu font size | (KK) */
body:not(.fse-enabled) .main-navigation a {
    font-size: 16px;
}
.main-navigation .sub-menu .menu-item a {
    font-size: 14px;
}
```
You can adjust the font size to your liking.

Also, remember that with your plan, you can access support directly via https://wordpress.com/help/contact. That way, you can get help faster.
petitpoisvideos · Member · Apr 13, 2021 at 11:17 am
Copy link
Yeah! Thanks fresatomica! Spot on!

Yes, I just didn’t remember the option I have with my plan – but I do think we got it right quite fast here!

Thanks again.

No items found.