Problemi CSS con Mozilla firefox

[Alvex]

Salve, non riesco a capire per quale motivo usando i css su un menu non riesco a fare cliccabile tutto lo sfondo della cella ma solo il testo contenuto nella cella. Il pulsante è realizzato tutto con i css c'è un rollover dove lo sfondo si sostiutisce ad un altro. Però me lo fa solo con firefox con explorer tutto funziona perfettamente. Qualcuno mi può dare una mano?
Questo è il css che sto utilizzando

a.menuleft:link {
background-image: url(../images/pull_service_off.gif);
text-decoration: none;
FONT-SIZE: 10px;
FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif;
COLOR: #FFFFFF;
font-weight: bold;
width: 135px;
height: 25px;
padding-left: 20px;
padding-top: 5px;
}
a.menuleft:visited {
background-image: url(../images/pull_service_off.gif);
text-decoration: none;
FONT-SIZE: 10px;
FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif;
COLOR: #FFFFFF;
font-weight: bold;
width: 135px;
height: 25px;
padding-left: 20px;
padding-top: 5px;
}
a.menuleft:hover {
background-image: url(../images/pull_service_on.gif);
text-decoration: underline;
FONT-SIZE: 10px;
FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif;
COLOR: #FFFFFF;
font-weight: bold;
width: 135px;
height: 25px;
padding-left: 20px;
padding-top: 5px;
}
.menuleftvisited {
background-image: url(../images/pull_service_on.gif);
text-decoration: none;
FONT-SIZE: 10px;
FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif;
COLOR: #FFFFFF;
font-weight: bold;
width: 135px;
height: 25px;
padding-left: 20px;
padding-top: 5px;

Grazie

[Alvex]

Sto continuando a provare per vedere se riesco a risolvere questa magagna.
Mettendo nel codice questi altri parametri(Sono segnati in rosso):
a.menuleft:link {
background-image: url(../images/pull_service_off.gif);
text-decoration: none;
FONT-SIZE: 10px;
FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif;
COLOR: #FFFFFF;
font-weight: bold;
width: 150px;
height: 28px;
padding-left: 20px;
padding-top: 5px;
background-repeat: no-repeat; display: inline-block;
}
a.menuleft:visited {
background-image: url(../images/pull_service_off.gif);
text-decoration: none;
FONT-SIZE: 10px;
FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif;
COLOR: #FFFFFF;
font-weight: bold;
width: 150px;
height: 28px;
padding-left: 20px;
padding-top: 5px;
background-repeat: no-repeat; display: inline-block;
}
a.menuleft:hover {
background-image: url(../images/pull_service_on.gif);
text-decoration: underline;
FONT-SIZE: 10px;
FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif;
COLOR: #FFFFFF;
font-weight: bold;
width: 150px;
height: 28px;
padding-left: 20px;
padding-top: 5px;
background-repeat: no-repeat; display: inline-block;
}
.menuleftvisited {
background-image: url(../images/pull_service_on.gif);
text-decoration: none;
FONT-SIZE: 10px;
FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif;
COLOR: #FFFFFF;
font-weight: bold;
width: 150px;
height: 28px;
padding-left: 20px;
padding-top: 5px;
background-repeat: no-repeat; display: inline-block;
}

Su firefox il rollover adesso funziona in tutta la cella ma continua a darmi problemi. Mi ha allargato la cella (solo su firefox Explorer va benissimo) e sul rollover oltre al cambiamento dello sfondo mi mette un colore di sfondo che io non penso gli abbia dato.
Grazie

[pat7331]

Parli di celle quindi usi tabelle. Perché non provi con i div?

[Alvex]

Si ho provato con i div e funziona tutto perfettamente
Grazie