Problema Hover Sul Css

[dima22]

salve ho un problema per quanto riguarda l'hover del mouse sul css.

Vi spiego ho un menu che quando ci passa sopra il mouse solo L'IMMAGINE di sfondo deve cambiare e non la scritta.
Di conseguenza posto il mio codice css:

.sf_submenu {
background-image: url(images/sf_submenu.jpg); //questa è la mia immagine di sfondo iniziale
background-repeat:no-repeat;
background-position:center;
font-family: Verdana, Geneva, sans-serif;
font-size:11px;
color:#000;
text-align:center;

}
.sf_submenu a:link {

font-family: Verdana, Geneva, sans-serif;
font-size:11px;
color:#000;
text-decoration:none;
text-align:center;
}
.sf_submenu a:hover {
background-image: url(images/sf_submenu_hover.jpg); //questa è l'immagine hover
background-repeat:no-repeat;
background-position:center;
font-family: Verdana, Geneva, sans-serif;
font-size:11px;
text-decoration:none;
color:#000;
text-align:center;
}

questo invece è il codice html:
<tr>
<td height="20" class="sf_submenu">TIRO TATTICO OPERATIVO</td>
</tr>

il problema è che quando ci passo con il mouse non me la fa vedere per intera l'immagine hover di sfondo!! dove sbaglio???

grazie

[Prill]

il problema è che quando ci passo con il mouse non me la fa vedere per intera l'immagine hover di sfondo!! dove sbaglio???

per visualizzare interamente lo sfondo dovresti assegnare al link un display:block e delle dimensioni precise in altezza e larghezza (pari a quelle dell'immagine)

[dima22]

ok grazie mille ho dato il display:block al link e nel css ho dato la altezza e larghezza necessaria e ho giocato con il background-position. grazie mille