title: Only scrolling inside one div, while website stays positioned
body: <p>I'm trying to create a website with the following.</p>
  
  <p>On top there's just a basic horizontal menu. Below that, on the left side, is another subcategory. The content will be on the right of the subcategory and can be very long.</p>
  
  <p>Now what I would like is that when you scroll anywhere on the page, it only scrolls the content div while everything else stays at its original position. I have been thinking about it for some hours now but I cannot really come up with a solution on how to do this.</p>
  
  <pre><code>&lt;html&gt;
  &lt;head&gt;
  &lt;link href="style.css" rel="stylesheet" type="text/css" /&gt;
  &lt;/head&gt;
  &lt;body&gt;
  &lt;div class="container"&gt;
      &lt;div class="left_side"&gt;&lt;/div&gt;
      &lt;div class="right_side"&gt;&lt;/div&gt;
  &lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  
  .container {
  width:1000px;
  }
  
  .left_side {
  float:left;
  width:250px;
  height:500px;
  background:green;   
  }
  
  .right_side {
  float:right;
  width:750px;
  height:1500px;
  background:yellow;
  }
  </code></pre>
  
  <p>Any idea on how to do this?
  Thanks in advance.</p>