3 Beispiele zur Positionierung von Hintergrundbildern:

1a | Liste mit Spiegelstrichen (font-size: 12px)
Positionierung mit "left 0.5em"

1b | Liste mit Spiegelstrichen (font-size: 18px)
Positionierung mit "left 0.5em"

 

2 | :hover-Effekt über Positionierung vom Hintergrund

2 | :hover-Effekt über Positionierung vom Hintergrund

Der Hintergrund wird über die entsprechenden Pixelwerte ausgerichtet (hier 0px/-32px). Hierbei handelt es sich um ein "Sprite".

Die Grafik sieht so aus:
buttons
 

3a | Positionierung vom Hintergrund
"50%(von links) 50%(von oben)"

3b | Positionierung vom Hintergrund
"10px(von links) 40px(von oben)"