Es una técnica llamada
CSS Sprites.
Básicamente, lo que haces es que, teniendo una imagen (100x50), creas dos elementos (50*50), con esa misma imagen de fondo y luego ajustas la imagen de fondo con background-position:
Código CSS:
Ver original.flecha_izquierda {
background-position: 0;
}
.flecha_derecha {
background-position: -50px 0;
}
En realidad es algo bastante simple. Lo única que haces es mover la imagen de fondo hasta donde la necesites tener.