The popular term for using images like the one above is "CSS sprites" which were introduced as a way of cutting down the number of HTTP requests that have to be made (and therefore saving time for the page to load).

The classic discussion about using CSS sprites comes from A List Apart magazine back in 2004: A List Apart: Articles: CSS Sprites: Image Slicing’s Kiss of Death