read
When I created the HTML and CSS of FORVM about half a year ago, I stumbled over a bug in Compass, that made it impossible to me to create a retina icon sprite, that was exactly twice the size of the standard sprite image. Using two folders, icon
and icon-retina
, the image order was completely messed up and I didn’t know why.
Some time ago I reused parts of the old code base and asked myself, why I didn’t post about that issue before. On default, Compass creates vertically aligned images. But with just two lines of code, you can force horizontal images, which will appear in correct order.
$icon-layout:horizontal;
$icon-retina-layout:horizontal;
Side note: On FORVM I used self-developed code to show either standard or retina images. Nowadays I stick to easier solutions like presented on Bourbon.io.