Ho risolto il problema da solo con un "display:block;" sull immagine in questione.
Ora però ho un altro problema. Ho infatti inserito anche una colonnina laterale. Fin qui tutto bene, ma guardate un po sta cosa
Questa è la visualizzazione corretta con Firefox :

Questa invece quella con IE8 :

Come vedete su IE vi è un margine destro di 1px sul div della colonnina. Come lo fixo ?
Questo è il css
codice:
body {background:green; background-image: url(mimetica.jpg); text-align : center; font-family: arial, sans-serif; margin: 0;}
img {border:0;}
.button {margin-left: 10px; margin-right: 10px;}
.bloc {display: block;}
#container {width:960px; border-left: 1px solid black; border-right: 1px solid black; margin:0 auto; background: #FFFACD url(gradcol.jpg) repeat-y top right;}
#header {}
#navigation {background-image: url(gradient.jpg);background-repeat:repeat-x; width: 960px;}
#col {float: right; width: 200px; margin-bottom: 10px;}
#content {text-align: left; margin-left: 15px; margin-right: 215px; margin-top: 10px; margin-bottom: 10px; background-color: #FFFACD;}
#footer {background: #006633; clear: right; width: 960px;}