title: How do I hide scroll bar by default
body: <p>I am using the following CSS to provide scroll bar when window is re-sized. I have two problems. One is the vertical scroll bar is visible by default. I want it to appear only if window is re-sized. I have tried with different heights but that didn't go. Second problem is when window is re-sized, the background color of the part of div which is viewed after scrolling is not applied. How do I fix these? This is my CSS and div</p>
  
  <pre><code>    &lt;div class = "gridclass" id="grid1" jsid="grid1" dojoType="dojox.grid.EnhancedGrid"
              query="{ name: '*' }"data-dojo-props="plugins:{ pagination:{pageSizes: ['10', '25', '50', '100'],
              description: true, sizeSwitch: true, pageStepper: true, gotoButton: true, position: 'bottom', maxPageStep: 7}}, rowsPerPage:10"&gt;&lt;/div&gt;
      &lt;/div&gt; 
  
      #grid1{
         overflow-x:auto;
         overflow-y:auto;
         height:60%; 
         width: 106.5%;
      }
  </code></pre>