Spazio tra le immagini

[Alhazred]

Sto realizzando un menu, riesco a farlo visualizzare correttamente su tutti i browser tranne che su IE7 e 8.
Si tratta di 5 pulsanti (immagini tra tag a) e un'immagine che funge da spaziatore tra un bottone e l'altro.
Il problema è che IE 7 e 8 tra i pulsanti e gli spaziatori aggiunge dello spazio aggiuntivo e non riesco ad eliminarlo.

Il codice html è questo

<a href="#">
	[img]images/btn_01.gif[/img]
</a>
[img]images/sp_01.gif[/img]
<a href="#">
	[img]images/btn_02.gif[/img]
</a>
[img]images/sp_02.gif[/img]
<a href="#">
	[img]images/btn_03.gif[/img]
</a>
[img]images/sp_03.gif[/img]
<a href="#">
	[img]images/btn_04.gif[/img]
</a>
[img]images/sp_04.gif[/img]
<a href="#" ">
	[img]images/btn_05.gif[/img]
</a>

Nel CSS ho questo

a {
	outline:none;
	text-decoration:none;
	margin:0;
}

img {
	border:none;
	margin:0;
}

Ho anche provato ad impostare nei tag img la larghezza dei pulsanti e degli spaziatori, ma senza cambiamenti.

Come elimino l'ulteriore spaziatura introdotta da IE?

[Alhazred]

Risolto: ho aggiunto delle regole solo per IE nel CSS dando dei margini negativi a destra e sinistra alle immagini.

[Mich_]

La cosa piu` semplice sarebbe usare una DTD Strict (ad esempio XHTML 1.0 Strict).

In alternativa, o se non funziona, si possono usare i Commenti condizionali (vedi "link utili" se non sai cosa sono)