title: Cannot get scroll-snap to work full screen
body: <p>I have a site I'm working on: <a href="http://astra.kevbrown.ca/index2.php" rel="nofollow noreferrer">http://astra.kevbrown.ca/index2.php</a> and cannot get the scroll-snap to work. I have a series of 100vh boxes and I want to snap to each as we scroll, to provide a narrative style of viewing. </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>body {
   margin:0px;
   max-width:100vw;
   scroll-snap-type: y mandatory;
  }
  .box { 
   width: 100%;
   height:100vh;
   background-size: cover;
   background-position: top center;
   text-align: center;
   position: relative;
   scroll-snap-align: start;
  }</code></pre>
  </div>
  </div>
  </p>
  
  <p>Any help on this folks?</p>