title: Dynamically resize overflow scrolling in a div without media queries
body: <p>Just wondering if there is a "simpler" way to resize a scrollbar than just use media queries?</p>
  
  <p>If I have to use media queries, then I have to adjust all the possible screen resolutions!</p>
  
  <p>Code example!</p>
  
  <pre><code>@media only screen and (min-height: 700px)
  and (max-height: 750px){
      #Container {
          height: 580px !important;
      }
  }
  
  @media only screen and (min-height: 750px)
  and (max-height: 900px){
      #Container {
          height: 680px !important;
      }
  }
  
  @media only screen and (min-height: 900px) {
      #Container {
          height: 750px !important;
      }
  }
  
  
  
  
  
  #Container {
      max-width: 100% !important;
      width: auto !important;
      overflow: auto;
  
  }
  </code></pre>