Question

Change browsing tabs

Hi community!

I need that instead of navigating the tabs by means of the arrow ->, they are shown in a list below, to be able to see them all together without having to navigate. That is, they are displayed in various rows depending on the amount that exists.

 

Any idea?

King Regards,

Ezequiel

Like

2 comments

Hello Ezequiel,

You'll need to add the following CSS:

.ts-tabpanel {
    height: auto;
}
 
.ts-tabpanel-items {
    overflow: visible;
    white-space: normal;
    margin: 0 !important;
}
 
.ts-tabpanel-scroll-left {
    display: none;
}
 
.ts-tabpanel-scroll-right {
    display: none;
}

This will change the tabs to wrap onto new rows if needed. If the display is wide enough it will look like this: 

If not, they will wrap like this:

Hope this helps.

Ryan

Ryan Farley,

Thank you for a very thorough explanation!

Best regards,

Matt

Log in or register to comment