Pues obviamente para que uno esté a la derecha del todo y otro a la izquierda. No es un poco más lejos. Si el contenedor midiera 5000 pixeles verías que no es sólo un poco.
Hay más formas de conseguir el mismo efecto, pero todas pasan por cambiarle el display: inline —cuando flotas un elemento, se convierte implícitamente en un elemento de bloque.
Por ejemplo, podrías poner que los span midieran 50% cada uno, ¿no? Así cubriría cada uno la mitad y por extensión uno estaría a la izquierda del todo y otro a la derecha. Pero no pasaría eso, porque a elementos en linea no les puedes aplicar un ancho. Ejemplo:
http://jsbin.com/oziheh/1/edit
Y no te olvides que son ejercicios para aprender el comportamiento y mostrarte situaciones de distinta índole.