How to easily create the CSS and image for a CSS Sprite

CSS Sprite is a technique to reduce the number of requests the browser makes to the server by combining 'many' images into a single image. CSS is then used to display a portion of this large image to the user in place of the single image.

This is all well and good but for most people sticking together lots of images and working out the display co-ordinates won't be a whole lot of fun. Enter CSS Sprite Generator.
- http://spritegen.website-performance.org/

With this web site you upload a zip file containing all your images, it gives back a single image along with the requisite CSS to display. Resulting in a faster loading web site with minimal effort.

There are a few other sites that have the same functionality
- http://csssprites.com/
- http://cssspritegenerator.net/
- http://www.spritecow.com/