title: Horizontal scrollbar appears with overflow content on right but not on left?
body: <p>I have an element with <code>position: absolute</code> in <code>body</code> with some part of it <em>to the left</em> from left side.</p>
  <p><a href="https://jsfiddle.net/blr_Oliver/wq73u9jn/" rel="nofollow noreferrer">Demo fiddle</a></p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="false" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>* {
    overflow: visible;
  }
  
  #test {
    position: absolute;
    height: 100px;
    width: 100px;
    left: -50px;
    background-color: lime;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div id="test"&gt;&lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  <p>I expect that horizontal scrollbar should appear allowing to scroll the document to the hidden part of the element, but it doesn't. So, I have some questions about the case:</p>
  <ol>
  <li>Why it happens so, why scrollbar doesn't appear (it works fine with symmetric layout on the right side)?</li>
  <li>Is it ever possible to make it appear and <strong>scroll to the left</strong> ?</li>
  <li>Am I missing anything very basic about scrollbars?</li>
  </ol>