title: Mac's not reliably displaying horizontal scroll bars.
body: <p>I'm at a loss as to why Mac's are refusing to display horizontal scroll bars reliably on overflowing elements. I'm not a frequent Mac user so this could just be me being stupid. </p>
  
  <p><a href="https://codepen.io/phawxby/pen/JrayeG" rel="nofollow noreferrer">https://codepen.io/phawxby/pen/JrayeG</a></p>
  
  <pre><code>ul {
    list-style-type: none;
    padding: 0;
    margin: 0;
    display: block;
    max-width: 500px;
    overflow-x: scroll;
    white-space: nowrap;
  
    li {
      display: inline-block;
      width: 150px;
      height: 150px;
      background-color: red;
    }
  }
  </code></pre>
  
  <p>Weirdly they don't display via browserstack but do display on the physical Mac next to me. Unfortunately we're getting reports of some users which are getting the issue too, obviously they're physical machines. </p>
  
  <p>Any suggestions would be much appreciated. </p>
  
  <p>High Sierra - Safari 11 Browserstack
  <a href="https://i.stack.imgur.com/2cngN.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/2cngN.png" alt="enter image description here"></a></p>
  
  <p>High Sierra - Chrome 61 Browserstack
  <a href="https://i.stack.imgur.com/4kjhg.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/4kjhg.png" alt="enter image description here"></a></p>
  
  <p>High Sierra - Safari 11 Physical
  <a href="https://i.stack.imgur.com/U1H5w.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/U1H5w.png" alt="enter image description here"></a></p>
  
  <p>High Sierra - Chrome 61 Physical
  <a href="https://i.stack.imgur.com/c8CMk.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/c8CMk.png" alt="enter image description here"></a></p>