title: Background-size contain not working in internet explorer
body: <p>I'm using Chrome and the code works fine, however, when I load it into Internet Explorer, it shows the image at it's actual size, not scaled to fit the screen. I want the image to be on the left side of the page and cover top to bottom, but not left to right. I want it to stay so the image is scaled properly. Here's what I've got. Is there a simpler way? I'm using Internet Explorer 8.
  ETA: The image is 340x554px</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;head&gt;
  
  &lt;style&gt;
  body{
  background-color:#000000;
  }
  
  #logo{
  top:0;
  bottom:0;
  left:0;
  position:absolute;
  background-image:url('logo.jpg');
  background-size: contain; 
  -webkit-background-size: contain;
  -moz-background-size: contain;
  -o-background-size: contain;
  background-repeat:no-repeat;
  height:100%;
  width:100%;
  }
  
  &lt;/style&gt;
  &lt;title&gt;Title&lt;/title&gt;
  &lt;/head&gt;
  &lt;body&gt;
  &lt;div id="logo"&gt;
  
  &lt;/div&gt;
  
  
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>