Tabs on two rows

[Aph100]

Hi
I am setting up a page 2/3 + 1/3. In the 2/3 area I want to add 5 tabs but with the tab heading, they won’t fit within the space. Is it possible to have the tabs on two rows?

Thanks

[Prasant]

Hello Alex,

Thanks for writing in!

Please inspect the tabs element and under Customize > Setup > Class add a class name. After that add following CSS under Pro > Theme Options > CSS:

.tab-two-row ul {
    display: block !important;
}

.tab-two-row ul li {
    display: inline-block !important;
}

Please replace tab-two-row with your own class name.

1- I have found the proper CSS code selector using the Chrome browser Developer Toolbar: https://www.youtube.com/watch?v=wcFnnxfA70g

2- For the CSS code itself, I suggest that you get started with this tutorial: https://www.youtube.com/watch?v=yfoY53QXEnI

Thanks.