title: position: sticky not working in desktop but OK in mobile
body: <p>I'm stuck with this error.
  I add position:sticky; to a div and it is not working when I am on desktop mode (max-width: 760px) but it works when I am in mobile mode.</p>
  
  <p>Here is my code</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>/* TOOL BAR */
  
  .tool-bar {
    /* Fixed size for the tool bar */
    width: 100px;
    /* To add a space between the header and the tool bar */
    margin: 30px 0;
    /* To have a nice column distribution centered */
    display: -webkit-flex;
    display: -ms-flex;
    display: flex;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    align-items: center;
    /* Keep the tool bar on screen when scrolling */
    position: sticky;
    position: -webkit-sticky;
    top: 0;
  }
  
  @media screen and (max-width: 760px) {
    /* Tool bar */
    .tool-bar {
      /* Take all the space instead of 100px */
      width: 100%;
      /* Stick the tool bar on the header to win space */
      margin: 0;
      /* Keep the bar tool visible when scrolling */
      position: sticky;
      position: -webkit-sticky;
      top: 0;
    }
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div class="tool-bar"&gt;
    &lt;!-- TOOLS --&gt;
    &lt;div class="tools"&gt;
      &lt;ul&gt;
        &lt;li&gt;&lt;img src="pictures/grids.png" alt="Grid" id="grid"&gt;&lt;/li&gt;
        &lt;li&gt;&lt;img src="pictures/pen.png" alt="Pen" id="pen"&gt;&lt;/li&gt;
        &lt;li&gt;&lt;img src="pictures/fill.png" alt="Fill" id="fill"&gt;&lt;/li&gt;
        &lt;li&gt;&lt;img src="pictures/dropper.png" alt="Dropper" id="dropper"&gt;&lt;/li&gt;
        &lt;li&gt;&lt;img src="pictures/eraser.png" alt="Eraser" id="eraser"&gt;&lt;/li&gt;
        &lt;li&gt;&lt;input type="color" id="color-picker" class="color-picker-style"&gt;&lt;/li&gt;
        &lt;li&gt;&lt;img src="pictures/reset.png" alt="Reset" id="reset"&gt;&lt;/li&gt;
      &lt;/ul&gt;
    &lt;/div&gt;
  
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>In desktop mode, it behaves as a position: relative.</p>
  
  <p>I have already checked, no overflow, no height: 100%...</p>
  
  <p>If you have any ideas? Thanks!</p>