Change Size and Font of TopBar Menue

[Keremdo]

Hey Guys,

is it possible to change the size and Font of the Menue in the Topbar? It would be nice if you are able to make it a little bit bigger and so on…

Thanks,

-Steve-

[Kyle – SUPPORT]

Hi

Sure, add this to your custom css:

#top-bar .tb-text > a, #top-bar nav .menu > li > a {
  font-size: 14px;
}

– Kyle

[Keremdo]

Hey Kyle,
perfect, thanks!

Could you also provide me a code to change the hover color in the top bar?Somehow the changes do not work when editing on the color customizer…

Bests,

-Steve-

[Keremdo]

Hey, already figured it out myself 😉
thanks

[Rui Guerreiro – SUPPORT]

Glad it’s sorted. Thanks Kyle
-Rui

[rcarrascope]

Sorry to hijack the thread but I actually have a very similar question.

I am trying to make the header main menu text smaller than 14px. but only when the screen width size <1024 and <1280 in order to avoid menu links go to the next line. I am using Atelier Header 10.

I found this css rule assigning currently 14px to the font:

#main-nav, #header nav, .vertical-menu nav, #header-section.header-9 #main-nav, #overlay-menu nav, #mobile-menu, #one-page-nav li .hover-caption, .mobile-search-form input[type="text"] {
    font-family: "Source Sans Pro";
    font-weight: 400;
    font-style: normal;
    font-size: 14px;
}

But when I tryed to change it in the Custom css it is not working. I tryed many options, one of them:

@media only screen and (min-width:1025px) and (max-width: 1279px) 
#main-nav, #header nav, .vertical-menu nav, #header-section.header-9 #main-nav, #overlay-menu nav, #mobile-menu, #one-page-nav li .hover-caption, .mobile-search-form input[type="text"]{
  font-size: 11px !important;
}

Could you help me?

Thanks in advance!
rcarrascope

[Mohammad – SUPPORT]

Hi,
Please provide me specific page url to check and resolve the issue.
Thanks
Mohammad