title: How to get bodies to not scroll while scrolling?
body: <p>I have been working on a website for the past few weeks and i've run into a problem. I have a header centered then body called .content a few inches underneath. The problem is that they both scroll when I scroll and i'd rather that not be a thing.</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-html lang-html prettyprint-override"><code>&lt;style type="text/css"&gt;
  body{
      margin:0px;
      background:#000;
  }
  .header-cont {
      width:100%;
      position:fixed;
      top:0px;
  }
  .header {
      height:50px;
      background:#000;
      border:1px solid #fff;
      width:960px;
      margin:0px auto;
  }
  .content {
      width:960px;
      background: #000;
      border: 1px solid #fff;
      height: 4000px;
      margin: 70px auto;
  }
  &lt;/style&gt;</code></pre>
  </div>
  </div>
  </p>