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>