<h1>Mobile scrolling tabs</h1>
<p>Adding a wrapper to the tabs forces horizontal scrolling on mobile devices.</p>

<div class="health-tabs-wrapper">
    <div class="health-tabs-wrapper-inner">
        <ul class="health-tabs au-link-list au-link-list--inline">
            <li class="active"><a href="#">Theropods</a></li>
            <li><a href="#">Sauropodomorpha </a></li>
            <li><a href="#">Ornithischia</a></li>
            <li><a href="#">Spinosaurus</a></li>
            <li><a href="#">Acrocanthosaurus</a></li>
            <li><a href="#">Ornithischia</a></li>
        </ul>
    </div>
</div>

No notes defined.

  • Handle: @tabs--mobile-scroll
  • Preview:
  • Filesystem Path: components/01-components/navigation/tabs/tabs--mobile-scroll.hbs