Css 图像精灵无法正确渲染视网膜

在这个网站上：我为可用的支付方式制作了一个小部件。所有的标志，在它预计是视网膜就绪。 我使用CoolRunning来开发使用spriteme服务的Sprite

---

然而，当我在chrome中放大到200%时，所有徽标看起来都拉长了。位置正确，只是图像被拉伸。如何理解问题…

我对视网膜没有太多经验，但这可能会有所帮助，我想你需要使用媒体查询

 @media 
 (-webkit-min-device-pixel-ratio: 2), 
 (min-resolution: 192dpi) { 
 /* Retina-specific stuff here */
 }

---

这是一篇关于它的好文章

将

背景大小

更改为

64px 584px在您的
ul.accepted-payment-methods li.american-express span
类中解决拉伸问题。从这里开始，只需调整每个付款类型的
背景位置
，您就可以开始了。
如果其中一个答案对您有用，请接受它（有关说明，请参阅）