[HTML-CSS]Hover sur une image...

Salut à tous !
En fait, j'ai un problème sur :
http://galaxy0.free.fr/Jeu/
Comme vous le voyez, il y a un bouton à gauche qui me permet d'aller sur une page.
Si vous cliquez sur ce bouton, vous verrez une image différente, comme si le bouton est pressé.
Voici le code que j'ai utilisé; d'abord le html...

<a href="http://galaxy0.free.fr/Jeu/Ordi_bord/index.php" class="ordi_bord"></a>

Et enfin, voilà le code que j'ai inséré dans mon CSS :

.ordi_bord:hover:before
{
content: url("http://galaxy0.free.fr/Design/Boutons/2Ordi-de-bord/ordi-de-bord-2hover.png");
}

.ordi_bord:focus:before
{
content: url("http://galaxy0.free.fr/Design/Boutons/2Ordi-de-bord/ordi-de-bord-3focus.png");
}

.ordi_bord:before
{
content: url("http://galaxy0.free.fr/Design/Boutons/2Ordi-de-bord/ordi-de-bord-1normal.png");
}

Voici mon problème; comme vous le voyez sur mon code CSS, il y a un HOVER.
Mais sur la page, il ne s'affiche pas...

Pourquoi ?
Comment régler ce problème ?

Si vous pouvez répondre à ces question, j'en serai ravi...
Merci d'avance !

Configuration: Windows Vista
Firefox 3.5.4