title: Image not scaling properly with browser
body: <p>Ugh,</p>
  
  <p>I been trying to tackle this problem for a long time....Please help.</p>
  
  <p>So I am trying to set up a background image , using only css/html. The image is pretty large i want to scale it down to fit perfectly for any time of aspect ratio. I have searched all over stackoverflow even tried some suggestions from here:</p>
  
  <p><a href="https://stackoverflow.com/questions/9262861/css-background-image-to-fit-width-height-should-auto-scale-in-proportion">CSS background image to fit width, height should auto-scale in proportion</a></p>
  
  <p>but nothing is working... </p>
  
  <p><strong>here is how it looks in my IE browser:</strong> <a href="http://i829.photobucket.com/albums/zz217/prakash911/site_zps36d59541.png" rel="nofollow noreferrer">http://i829.photobucket.com/albums/zz217/prakash911/site_zps36d59541.png</a></p>
  
  <p><strong>Actual Image:</strong> <a href="http://i829.photobucket.com/albums/zz217/prakash911/background_zps92b4855f.png" rel="nofollow noreferrer">http://i829.photobucket.com/albums/zz217/prakash911/background_zps92b4855f.png</a></p>
  
  <p><strong>sample Test DEMO:</strong>  <a href="http://jsfiddle.net/4GkFu/" rel="nofollow noreferrer">http://jsfiddle.net/4GkFu/</a></p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
      &lt;head&gt;
          &lt;meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /&gt;
      &lt;/head&gt;
      &lt;body style="overflow:hidden;"&gt;
  
          &lt;div id="divimg" style="position:absolute; left:0px; top:0px; right:0px; bottom:0px; overflow:hidden;" &gt;
              &lt;img src="img/background.png" style="position:absolute; left:0px; top:0px; width:100%; height:auto;"/&gt;
          &lt;/div&gt;
  
      &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>