sono riuscito ad ottenere quello che volevo così:

codice:
li.menu-303 a.active {
  display:block;
  width:150px;
  height:50px;
  background: transparent url(on.jpg) no-repeat;
  text-indent: -10000px;
  float:left;
  margin-left:20px;
  border:1px solid red;
}
...ma c'è un fastidioso effetto indesiderato:
quando vado sopra il pulsante l'immagine cambia ma se esco dall'area pulsante prima del caricamento della pagina si vede per un attimo l'immagine precedente off.jpg ...una volta che la pagina è stata caricata il pulsante è OK on.jpg ...spero di essermi spiegato...

gli esperti che soluzione suggeriscono???

thanks!