title: Materalize footer doesn't stay at bottom?
body: <p>Im using materialize for my webpage, and for some reason the footer won't stay at the bottom even though I use Materialize own recommended CSS for this. Am I missing something? </p>
  
  <p>Here's the CSS: </p>
  
  <pre><code>body {
    display: flex;
    min-height: 100vh;
    flex-direction: column;
  }
  
  main {
    flex: 1 0 auto;
  }
  </code></pre>
  
  <p>And here's the HTML for the footer: </p>
  
  <pre><code>&lt;footer class="page-footer green lighten-1"&gt;
  &lt;div class="container"&gt;
      &lt;div class="wrapper"&gt;
  
        &lt;!--   Icon Section   --&gt;
        &lt;div class="row"&gt;
          &lt;div class="col s12 m4"&gt;
            &lt;div class="icon-block"&gt;
              &lt;h4 class="green-text" id="mailIcon"&gt;&lt;i class="material-icons"&gt;mail&lt;/i&gt;&lt;/h4&gt;
              &lt;p class="white-text"&gt;info@storytourist.com&lt;/p&gt;
            &lt;/div&gt;
        &lt;/div&gt;
  
          &lt;div class="col s12 m4"&gt;
            &lt;div class="icon-block"&gt;
              &lt;h4 class="green-text" id="adressIcon"&gt;&lt;i class="material-icons"&gt;map&lt;/i&gt;&lt;/h4&gt;
              &lt;p&gt;Veldrom AB, Anckargripsgatan 3, 211 19 Malmö, Sweden&lt;/p&gt;
            &lt;/div&gt;
          &lt;/div&gt;
  
          &lt;div class="col s12 m4"&gt;
            &lt;div class="icon-block"&gt;
              &lt;h4 class="green-text" id="phoneIcon"&gt;&lt;i class="material-icons"&gt;phone&lt;/i&gt;&lt;/h4&gt;
              &lt;p class="white-text"&gt;+46 720 427 346&lt;/p&gt;
            &lt;/div&gt;
          &lt;/div&gt;
        &lt;/div&gt;
  &lt;/footer&gt;
  </code></pre>