title: just one div scrollable on page
body: <p>I need nothing on page to be scrollable except one div (<code>divleft</code>), and it should be scrollable by mouse, not by scrollbar. All scrollbars should be hidden.</p>
  
  <p>I treid a solution with narrower parent div (<code>divleftwrap</code>), but id doesnt work.</p>
  
  <pre><code>&lt;div id="slidetop"&gt;
  323&lt;br&gt;
  323&lt;br&gt;
  323&lt;br&gt;
  &lt;/div&gt;
  &lt;div id="menutop"&gt;&lt;/div&gt;
  &lt;div id="wrapt"&gt;
  &lt;div id="divleftwrap"&gt;
  &lt;div id="divleft"&gt;
  ...
  &lt;/div&gt;
  &lt;/div&gt;
  &lt;div id="divright"&gt;
  ...
  &lt;/div&gt;
  &lt;div class="clear"&gt;&lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>css</p>
  
  <pre><code>html, body{
    overflow:hidden;
  }
  #slidetop{
      display:none;
  }
  #menutop{
      height:25px;
      background:red;
  }
  #divleftwrap{
      float:left;
      width:60%;
      background:blue;
      height:100%;
  }
  #divleft{
      width:clac(100% + 17px);
      background:green;
    overflow-y:scroll;
  }
  #divright{
      width:25%;
    float:right;
      background:lightblue;
  }
  </code></pre>
  
  <p>js - this should stay to work</p>
  
  <pre><code>$("#menutop").click(function(){
      $("#slidetop").slideToggle();
  });
  </code></pre>
  
  <p>HERE IS <a href="https://jsfiddle.net/bonaca/18agqyvy/" rel="nofollow">JSFIDDLE</a></p>