title: Can't position background image in Chrome and Safari
body: <p>I have the following code in my CSS: </p>
  
  <pre class="lang-css prettyprint-override"><code>#photos {
     width:340px;
     height:250px;
     background-image: url('../images/photosBoxIcon.png'); 
     background-position: top 20px right 20px;
     background-repeat:no-repeat;
     background-color:#211f1f;
     border: 1px solid #666666;
     float:left;
     margin-top:20px;
     border-radius: 2px;
     -webkit-border-radius: 2px;
    -moz-border-radius: 2px;  
  }
  </code></pre>
  
  <p>While this code successfully positions my background icon in Firefox and Opera, Chrome and  Safari position the icon in the top left corner.</p>
  
  <p>When inspecting the code in chrome, I can see the line <code>background-position: top 20px right 20px;</code> crossed and with a warning mark on the beginning on the line, which means that Chrome consider this code incorrect. Can anyone spot my mistake?</p>