如何将背景图像放置在距其容器右侧绝对距离的位置？

我可以使用以下命令将一个小背景图像/图标放置在距其容器左中心 4 像素的位置：

background: url(...) no-repeat 4px 50%;

我怎样才能把它定位到距离 4 个像素的地方right?

根据您的情况以及您想要支持的浏览器，此方法有效（在 IE7-8、Firefox 上测试）：

background: url(...) no-repeat right 50%; border-right: 4px solid transparent;

当然，如果你已经在右边设置了边框，这对你没有任何帮助。

编辑时添加：如果上述方法不起作用，因为您正在使用边框，并且您不关心 IE7（不确定我们是否已经到了这一点），并且您的“图标”宽度已知，那么您可以这样做：

.yourContainer {
  position: relative;
}

.yourContainer:after {
  content: ' '; 
  display: block; 
  position: absolute; 
  top: 0; 
  bottom: 0; 
  right: 4px; 
  width: 10px; //icon width
  z-index: -1; //makes it act sort of like a background
  background: url(...) no-repeat right 50%;
}