How to clip background sprite images to prevent other images from appearing

HTML & CSS
1

I saw an article today that explained how to do this, but I can’t find it now.

It basically illustrated a method of using generated content to display a portion of an image sprite. In effect, allowing you to create tight spacing between images within your sprite without fear of other images showing through when using a single icon on a tall background.

Anyone know this method and have an example?

2

I found the answer I was looking for.

Given a div classed “tags”, to add an icon located in sprite.png, clipping it to 20x16, the code would be:

.content .tags:before{content:'';background:url(../../sprite.png) no-repeat 0 -1415px;height:20px;width:16px;position:absolute;left:30px}