[xhtml]-[CSS] problema ai link per utenti firefox

Salve a tutti é la prima volta che scrivo qui sul forum,spero di essere abbastanza chiaro in modo che mi possiate aiutare:

ho creato un sito che nella parte superiore ha dei link composti da immagini,vi linko una pagina qualsiasi con i link in questione:

http://dharlet.altervista.org/diplomazia.htm

i link li ho creati in questo modo:
visto che nel html non ho trovato un modo per creare dei immagini che facciano da link e al passaggio del mouse si illuminino uso come link vero e proprio una gif trasparente che proprio non si vede e gli assegno un id in questo caso "diplomazia".Ecco il codice del link:

<a href="http://dharlet.altervista.org/diplomazia" accesskey="d" id="diplomazia" style="cursor: crosshair" title="diplomazia"><img src="http://dharlet.altervista.org/img/blank.gif"></a>

poi nel css metto come sfondo a questa gif trasparente,l'immagine che voglio sia effettivamente vista con il css:

a#diplomazia {background-image:url("http://dharlet.altervista.org/img/diplomazia.gif");}

per fare in modo che si illumini al passaggio del mouse,utilizzando sempre il css faccio in modo che lo sfondo dell'immagine trasparente cambi:

a#diplomazia:hover {background-image:url("http://dharlet.altervista.org/img/diplomaziahover.gif");}

mi é sembrato un sistema buono,infatti funzionava a meraviglia ogni volta che lo controllavo perche uso Internet explorer,ma un mio amico che usa firefox,mi ha detto che vede i tasti come tagliati a metà,perché si spostano un po in basso,anche se ho impostato padding e margin allo 0.
ho provato a fare di tutto,e ho chiesto in giro ma nessuno sa come fare a rimediare,c'é un modo per far si che si veda bene anche usando firefox?

nel caso vi serva vederle le tre immagini in questione sono:

immagine bianca trasparente (nome:blank.gif)
http://dharlet.altervista.org/img/blank.gif

immaggine con la scritta diplomazia scura(nome:diplomazia.gif)
http://dharlet.altervista.org/img/diplomazia.gif

immaggine con la scritta diplomazia chiara,quella al passaggio del puntatore(nome:diplomaziahover.gif)
http://dharlet.altervista.org/img/diplomaziahover.gif

posso cambiare tutto quello che serve l'importante e che le immagini siano ben visibili da tutti....
spero qualcuno di voi possa aiutarmi
grazie in anticipo

[dementialsite]

Hai provato ad impostare all'immagine "blank.gif" una larghezza e un'altezza, così?

<a href="http://dharlet.altervista.org/diplomazia" accesskey="d" id="diplomazia" style="cursor: crosshair" title="diplomazia">
<img src="http://dharlet.altervista.org/img/blank.gif" width="165" height="40">
</a>

Stammi bene...

No,non ci ho mai provato...
anche se l'immagine blank.gif é dell'esatta grandezza delle altre immagini...
vado a provare e torno...

P.S. mi serve qualcuno che mi dica se funziona perche purtroppo non ho firefox

ok ho fatto,ho impostato larghezza e altezza sia sui link che sull'immagine blank.gif,qualche buon volontario con firefox mi potrebbe dire se ora si vede ben?grazie

[Ospite]

Il problema persiste, ecco uno screenshot: http://img78.imageshack.us/img78/9201/screenlw4.png

hmm che posso fare? il problema sarà che firefox interpreta la cosa in un certo modo e tende a tagliarmi le immagini se non specifico il contrario,ma io non so con che funzione farlo... ho gia settato padding e margin a 0,impostato la larghezza e altezza,non so che altro fare...
puo centrare con il doctype che va messo all'inizio? perche io fin ora non l'ho usato visto che non ho mai capito quale mettere...

qualcuno mi darebbe un doctype da inserire che non mi mandino all'aria tutto? quelli che io ho tentato di mettere mi danno problemi...
potrebbe essere quello il problema

[DS] Non inviare messaggi consecutivi, usa la funzione EDIT del forum...