title: Materialize CSS sticky footer flex properties not working
body: <p>When I apply the css properties shown for sticky footers for Materialize <a href="http://materializecss.com/footer.html" rel="nofollow">here</a>, the height of my main element shoots up to about 33000px. Footer shows fine, but above it is blank (presumably for a length of about 33000 pixels). The elements are arranged correctly with header, then main, then footer elements.</p>
  
  <p>html:</p>
  
  <pre><code>&lt;body&gt;
      &lt;header&gt;
        Header stuff
      &lt;/header&gt;
      &lt;main&gt;
        Main stuff
      &lt;/main&gt;
      &lt;footer&gt;
        Footer stuff
      &lt;/footer&gt;
  &lt;/body&gt;
  </code></pre>
  
  <p>sass:</p>
  
  <pre><code>body
    display: flex
    min-height: 100vh
    flex-direction: column
  
  main
    flex: 1 1 auto
  </code></pre>