无法在Chrome和Safari中定位背景图片

Question

我的CSS中有以下代码：

#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;  
}

虽然此代码在Firefox和Opera中成功定位了我的背景图标，但Chrome和Safari将图标放在左上角。

在检查chrome中的代码时，我可以看到划线background-position: top 20px right 20px;并且在行的开头有一个警告标记，这意味着Chrome认为此代码不正确。谁能发现我的错误？

Answer 1

使用

background-position: top right;

或

background-position:20px 20px;

你也可以使用简写：

background:#211f1f url('../images/photosBoxIcon.png') 20px 20px no-repeat;

http://www.w3schools.com/cssref/pr_background-position.asp

"background-position: top 20px right 20px;"

它不是一个正确的语法可能是这就是为什么chrome没有正确显示结果

Answer 2

background-position: top right 20px 20px;