Docs

[Tom A]

When the browser is scaled down, the tabs are stacked on top of each other. How could i change when this happens?
I have rather short menu texts in a four-up tab and it changes to being on top of each other somewhere around 979px. I would like to do it much later as there is plenty of room for the tabs to shrink further.
I’m trying to make a mobile menu that would fit a portrait screen and it would be okay if it stacks the tabs when the menu text becomes a problem

Here is the menu http://lentopaikat.fi/mobile/

[Rupok]

Hi there,

Thanks for writing in! Do you want the desktop layout on mobile as well?
You can add this under Custom > CSS in the Customizer.

@media only screen and (max-width: 979px) {
.x-nav-tabs.two-up > li, .x-nav-tabs.three-up > li, .x-nav-tabs.four-up > li, .x-nav-tabs.five-up > li {
  float: left !important;
  width: 25% !important;
}
}

Hope this helps.

[Tom A]

Yes i would like it on mobile as well.
The above code worked nicely, thank you, now my menu looks nice on a small mobile device as well

[Thai]

If you need anything else please let us know.

[Author]

Posts