Tabs element not mobile friendly?

[tamarapensa]

Hey

I’m having issues with the tabs element on screens & devices smaller than large

on actual mobile devices it doesn’t show that you can move side to side, how can i make this mobile friendly as it is really poor right now

thanks

[tristup]

Hi @tamarapensa,

The Tab element is not coded to switch to vertical mode on mobile. If you do not like the mobile view of the tab element you can use the hide during breakpoint feature to hide the tab element for mobile devices and use another element such as Accordion or whatever element that you see fit.
If you still want to use the Tabs, I would suggest you go through the following thread on a similar topic.

The Tabs Element isn't Responsive

Hey @core365, I’ll show you some custom CSS to achieve a responsive tab behavior but please note that it is to our understanding that you will learn Flexbox and continue to work on the custom CSS to achieve what you need. I’d recommend that you first see the result or the behavior the custom CSS would be doing. Please watch this screencast: https://youtu.be/hiudVkXn_KE The custom CSS used is this: @media (max-width:640px) { .x-tabs-list ul { flex-wrap: wrap; } .x-tabs-lis…

Tabs element not responsive

Hi Jenna, Please add this code to the Element CSS of the Tab element: @media(max-width: 480px) { $el .x-tabs-list { flex-direction: column; } } Hope this helps.

Hope it helps.
Thanks