Responsive Scrolling Tabs

<div class="container">

  <div class="tablist">

    <ul class="inner">

      <li class="tablist__tab">Tab 1</li>

      <li class="tablist__tab">Tab 2</li>

    </ul>

  </div>

  <div class="tablist" role="tablist">

    <ul class="inner">

      <li class="tablist__tab">Lorem ipsum dolor sit</li>

      <li class="tablist__tab">amet</li>

    </ul>

  </div>

  <div class="tablist" role="tablist">

    <ul class="inner">

      <li class="tablist__tab">Tab 1</li>

      <li class="tablist__tab">Tab 2</li>

      <li class="tablist__tab">Tab 3</li>

      <li class="tablist__tab">Tab 4</li>

      <li class="tablist__tab">Tab 5</li>

    </ul>

  </div>

  <div class="tablist" role="tablist">

    <ul class="inner">

      <li class="tablist__tab">Lorem</li>

      <li class="tablist__tab">ipsum dolor</li>

      <li class="tablist__tab">sit</li>

      <li class="tablist__tab">amet consetetur</li>

      <li class="tablist__tab">sadipscing</li>

      <li class="tablist__tab">elitr</li>

    </ul>

  </div>

</div>