Adjust sub-menu font size

Hello!

First of all, awesome work with Cali! I absolutely love the theme and its simplicity.

One question though: the sub-menu items seem to have a larger font than the main menu item. I’d like to see this the other way around. How can I decrease the font size of sub-menu items?

Sorry if I overlooked something. Just can’t find it, neither on this forum. :slight_smile:

Desiré

Hello there,

Please try adding this CSS code to Appearance > Customize > Additional CSS from dashboard.

    @media only screen and (min-width: 1200px) {
      .main-navigation ul .sub-menu li a, 
      .main-navigation ul .children li a {
        font-size: 13px;
      }
    }

Regards,
Kharis
aThemes Support

1 Like

Thanks for your reply, but unfortunately that doesn’t seem to work. It stays like this, also if I change the font size to for example 8, just to test it.

Another solution would be to just increase the width of the sub-menu.

And I’d also like to know if it’s possible to get a divider (thin line) between sub-menu items. Maybe that will make things clearer.

Thanks again!
Desiré

Hello Desiré,

Please provide us a link to your website, so we can inspect what might be stopping the code from properly working.

Regards,
Kharis
aThemes Support

1 Like

https://www.valenciacitytrip.com :slight_smile:
Please let me know when you’re done checking, so I can reactivate the “coming soon” mode. :slight_smile:

Hello there,

Thank you for sharing. Try this code:

    @media only screen and (min-width: 1200px) {
      .main-navigation ul .sub-menu li a, 
      .main-navigation ul .children li a {
        font-size: 13px !important;
      }
    }

Regards,
Kharis
aThemes Support

1 Like

Thanks, but this is also not working. :frowning:

Hello there,

Do you have active caching system on your site? Please flush it first and reload your site. If you don’t have it on your site, perhaps your web hosting does it in the background. So please consult to your host to help flush it.

Regards,
Kharis
aThemes Support