title: Auto hiding vertical scrollbars using css overflow
body: <p>I came across a problem using css overflow for autohiding the vertical scrollbar. I read in a few articles to use css hover pseudo class to achieve this behaviour and the good thing is I am successful to some extent.</p>
  
  <p>I used both 'scroll' and 'auto' for the overflow-y property. With scroll it works like a charm, but with 'scroll' the problem is even if there is no need to show the scrollbar, it is visible which I feel 'auto' does very well.</p>
  
  <p>But again with 'auto' the problem is there is a 16px(I assume) gap at the right side. Probably it the width of the scrollbar. I wanted the full width. I used a background to explain my problem.</p>
  
  <p>Here is the fiddle. <a href="http://jsfiddle.net/9scJE/">http://jsfiddle.net/9scJE/</a></p>
  
  <pre><code>div.autoscroll {
      height: 200px;
      width: 400px;
      overflow: hidden;
      border: 1px solid #444;
      margin: 3em;
  }
  
  div.autoscroll:hover {
      /* overflow-y: scroll; */
      overflow-y: auto;
  }
  </code></pre>
  
  <p>Appreciate any help.</p>