ragazzi ho un problema simile anche io, ma non riesco a risolvere con questo metodo, rimane una minuscola strisciolina attorno alle immagini comunque e non va via purtroppo.
Questo è il codice della pagina html
..................
<div id="sezione_prodotti">
<p class="barra_prodotti">
<a href="porte.html">
[img]images/prodotti_1.jpg[/img]
</a>
<a href="infissi.html">
[img]images/prodotti_2.jpg[/img]
</a>


<a href="arredo.html">
[img]images/prodotti_4.jpg[/img]
</a>
<a href="cucine.html">
[img]images/prodotti_3.jpg[/img]
</a>
</p>
</div>
...............................

Nel css ho questi valori per il div, per il paragrafo e per le immagini:
.....................................
#sezione_prodotti {
background-image: url('images/sfondogenerico.jpg');
width: 740px;
height: 542px;
margin: 15px auto;
text-align: center;
padding: 0 0 0 0;
}

.barra_prodotti {
margin:0 0 0 0;
padding:0 0 0 0;
padding-top: 0.5cm; // mi serve per posizionamento su immagine sfondo del <div>
}

img {
margin:0 0 0 0;
padding:0 0 0 0;
}
................................

Ci sbatto la testa da qualche giorno ma non riesco a risolvere il problema, qualcuno mi può dare una mano, se ci capisce qualcosa, sempre per favore ovviamente. grazie e ciao.