Primary Menu Text Responsive

[hivehouse]

Is there a way to have the text for the primary menu to decrease in font size at the various break points?

[lely]

Hi There,

Thanks for posting in.
I can see you have multiple license on both X and Pro. Is this question, related to X or Pro theme?

If for Pro, please check this thread:

Header Fonts

That thread will give you guidance on how to achieve responsive text because primary menu on PRO is an element too.

In case you are referring to primary menu on X, we can use CSS media query to target those font size per screen size. Something like this:

@media (max-width: 768px) {
   .x-navbar .desktop .x-nav > li > a {
      font-size: 18px;
   }
}
@media (max-width: 480px) {
   .x-navbar .desktop .x-nav > li > a {
      font-size: 15px;
   }
}

Adjust font size accordingly. You may also add another breakpoint.

Hope this helps.

[hivehouse]

I didn’t realize the same stepped font sizes would work against the header element in Pro as well (I am using Pro).

Thanks much!

[Joao]

You are welcome!