mi sembra che hai creato un "button" alto 22 px ma il pulsante "submit" che ti invia il comando ha 8 px di padding, quindi ti mangia la base, prova ad aumentare i 22 px... e i 28 dell'altro....

Grazie Antonio per la risposta.

Purtroppo avevo già provato ad alzare di 8 px il primo button, ho modificato il valore height da 22px a 30px ma avviene il problema opposto cioè l'immagine si visualizza correttamente su Firefox mentre si vede "allungata" su Chrome e Internet explorer.

Stessa cosa con l'altro button ovviamente...

Ti posto il codice del primo button, vediamo se riesci tu o qualcun altro a farmi venire fuori da questo pasticcio:

#button
{
margin-top:1px;margin-left:1px;
text-align: center;
border:none;
display:block;
overflow:hidden;
cursor:pointer;
width:142px;
height: 22px;
color:green;
font-size:16px;
background: transparent url(files/accesso-aziende.png) no-repeat;
}
#button:hover
{
background-position:0 -30px;
}

quindi ricapitolando:

- se metto "height: 22px;" l'immagine viene visualizzata correttamente con Chrome e Internet explorer ma viene tagliata con Firefox

- se metto "height: 30px;" l'immagine viene visualizzata correttamente con Firefox ma viene allungata con Chrome e Internet explorer

ora non sono davanti al pc con website, dopo provo, ma intanto potresti provare ad inserire l'immagine png e fargli sopra un collegamento ad accesso-aziende.html invece di fare un form con un bottone input, o sto dicendo una sciocchezza?

Quello che dici funzionerebbe, solo che volevo una cosa più sofisticata rispetto ad un immagine fissa con collegamento.

Se noti infatti con l'impostazione che gli ho dato l'immagine "si muove" al passaggio del mouse.