title: Setting background image without stretch the image using CSS
body: <p>I'm trying to set the background image using CSS but the original image is stretched.
  How do I keep the original image size and set the background for the entire page at the same time? </p>
  
  <pre><code> body {
    margin: 0;
    background-image: url(background.png);
    background-size: cover;
    background-repeat:   no-repeat;
    background-position: center center;
  }
  </code></pre>
  
  <p>The original image is: <a href="http://i.stack.imgur.com/RWPck.png" rel="nofollow">Original Image</a></p>
  
  <p>And the result is: <a href="http://i.stack.imgur.com/sW1r1.png" rel="nofollow">Resultent Image</a></p>
  
  <p>The difference is the background in my web is larger than the original.</p>
  
  <p>Any help would be appreciated !!!</p>