elementor-tabs-as-tabs-mobile

Elementor – Keep Tabs as Tabs on mobile

Get the latest from
Sniffle Valve

Sniffle Valve

Consider buying Sniffle Valve a coffee  

Book a one-on-one online training session

Note: To copy any code presented in these tutorials, hover over the code and select the Toggle RAW Code icon raw code icon

There are times when one wants to have the Elementor Tabs widget to keep displaying as tabs on mobile instead of switching to an accordion. This tutorial will show you how to do so.

Note that if you want all of your tabs to behave this way, then do NOT add the CSS ID in the Advanced tab on the Tabs widget and remove the h-tabs from the provided CSS below:

@media (min-width: 320px) {
  #h-tabs .elementor-tabs-wrapper {
    display: flex;
    	flex-direction: row;
  }
}

@media (min-width: 320px) {
  #h-tabs .elementor-tab-mobile-title {
    display: none;
  }
}

 

Leave a Comment

Your email address will not be published. Required fields are marked *