title: Background-size 100% not working in IE8 and IE7
body: <p>I have an empty div which contain a background image that is bigger than the size of the container. I fix this one by <code>background-image</code> property with the value (100% 100%). That's fine until you open the example in IE8 and IE7. Any solutions for that, even a javascript script or jquery plugin?</p>
  
  <p>i.e: <a href="http://jsbin.com/imirer/1/edit" rel="nofollow">http://jsbin.com/imirer/1/edit</a></p>
  
  <p>i.e: <a href="http://jsfiddle.net/bPTzE/" rel="nofollow">http://jsfiddle.net/bPTzE/</a></p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;div class="container"&gt;
      &lt;div class="background"&gt;&lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>CSS:</p>
  
  <pre><code>.container {
      /* an example width for responsive perpose */
      width: 500px;
  }
  
  .background {
      height: 27px;
      background: url("http://s18.postimage.org/jhbol7zu1/image.png") no-repeat scroll 100% 100% transparent;
  
      /* not working in IE8 and IE7 */
      background-size: 100% 100%;
  }
  </code></pre>