tigarielectronice
New Member
I have a shopify website with a customised theme.The images are in a sprite named "sprite_images.png".I'm looking at some sites about applying retina sprites to retina displays.http://miekd.com/articles/using-css-sprites-to-optimize-your-website-for-retina-displays/http://alexthorpe.com/uncategorized/css-sprites-for-retina-display-devices/683/I've created a sprite and called it "sprite_imagesx2.png". The css for this isnt working. Here's an example.\[code\]h1.title{ background:url({{ 'sprite_images.png' | asset_url }}) no-repeat 0 0; width:108px; height:12px; margin:0 auto 10px; overflow:hidden; display:block; text-indent:-999px;}@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (min-resolution: 240dpi) { h1.title{ background-image:url({{ 'sprite_imagesx2.png' | asset_url }}) background-size:108px 12px; }}\[/code\]It's not working at all and I have been wondering if the x2 sprite needs to be called "sprite_images@x2" so I'm trying this atm and the image can't be uploaded with a special character.I don't know if this is what's wrong but if it is how can I upload the image with the @ to shopify?