2.38 #Components.Tabs Tabs

Toggle example guides Toggle HTML markup

Tabs is a simple tabs component which allows you to show one piece of content at a time

JavaScript is required to actually add/remove the classes/href for the active item. Additionally, when implementing this element, each tab's panel should have an role="tabpanel" to properly communicate that these elements are related.

Browser support: IE11+, Safari6.1+, Firefox22+, Chrome21+

Markup 
<nav class="sb-tabs" role="tablist">
  <span class="sb-tabs__tab" role="tab" aria-selected="false">Chart type</span>
  <a href="#data" class="sb-tabs__tab sb-tabs__tab--active" role="tab" aria-selected="true">Data</a>
  <a class="sb-tabs__tab sb-tabs__tab--disabled" role="tab" aria-selected="false">Visualization</a>
</nav>
Source: components/_tabs.scss, line 1