Aide CSS (ul)

J'ai un petit problème avec le code suivant :

extrait du code html :

<div id="m1">
<ul>
<li><a href="page1.htm">page 1</a></li>
<li><a href="page2.htm">page 2</a></li>
<li class="m1-enabled"><a href="page3.htm">page 3 (active)</a></li>
</ul>
</div>


extrait du .css :

#m1 ul a:link, #m1 ul a:visited {
display: block;
font-family : georgia;
font-size: 10px;
text-align : center;
vertical-align: bottom;
width: 102;
height: 38;
color: black;
text-decoration: none;
background-image: url("bt_disable.png");
}

#m1 ul a:hover, #m1 ul a:active {
background-image: url("bt_over.png");
}


.m1-enabled:link {
background-image: url("bt_enable.png");
}

Comme vous pouvez le constater, le texte est affiché sur l'image, et
j'ai 3 images qui représentent l'état en cours :

bt_disable.png : bouton désactivé
bt_over.png : bouton actif (passage de la souris sur le bouton)
bt_enable.png : bouton sélectionné (page en cours)

la class m1-enabled ne fonctionne pas, en fait je voudrais pouvoir
afficher un fond différent sur mon bouton (bt_enable.png) quand la page
concernée est active (page 3 dans cet exemple).

Pouvez-vous m'aider ???