title: CSS image background - stretch height to 100% but keep image horizontally centered on page
body: <p>Any help would be greatly appreciated!!</p>
  
  <p>The page I'm working on is here
  <a href="http://www.iknowpost.com/" rel="nofollow">http://www.iknowpost.com/</a></p>
  
  <p>What I'm attempting to do is keep the background image stretched to 100% height, regardless of the viewer's screen size, while keeping the image centered horizontally on the page at all times.  As of now I've got the 100% height figured out, but I've been trying unsuccessfully to figure out how to center it horizontally - currently it's fixed left: 0px;  I think this should be pretty simple.  My code is below, and perhaps this isn't the right way of going about this.  Thanks!</p>
  
  <pre><code>&lt;style type="text/css"&gt;
  #background {
  width: 100%; 
  height: 100%; 
  position: fixed;
  left: 0px; 
  top: 0px; 
  z-index: -1;
  }
  
  .stretch {
      height:100%;
  }
  &lt;/style&gt;
  
  &lt;/head&gt;
  
  &lt;body&gt;
  &lt;div id="background"&gt;
      &lt;img src="logo.jpg" class="stretch" alt="" /&gt;
  &lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>