title: Sticky position CSS in nested div not working
body: <p>I have an issue with sticky position.</p>
  
  <p>This works:</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-html lang-html prettyprint-override"><code>&lt;html&gt;
  
  &lt;body style="height: 2000px; "&gt;
      &lt;div style="height: 100px;"&gt;&lt;/div&gt;
      &lt;div style="position: sticky; top: 10px;"&gt;LOREM IPSUM&lt;/div&gt;
  &lt;/body&gt;
  
  &lt;/html&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>This doesn't work:</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-html lang-html prettyprint-override"><code>&lt;html&gt;
  
  &lt;body style="height: 2000px; "&gt;
      &lt;div style="height: 100px;"&gt;&lt;/div&gt;
      &lt;div&gt;
              &lt;div style="position: sticky; top: 10px;"&gt;LOREM IPSUM&lt;/div&gt;
      &lt;/div&gt;
  &lt;/body&gt;
  
  &lt;/html&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>My question is: why the inner div is not sticky? I tested it with Chrome 64.</p>