[cssdesign] immagini mappate

[Francesca]

Salve a tutti,
	vorrei linkare un menu grafico utilizzando la tecnica "dell'emulazione 
di immagini mappate" descritta da Troiani in un suo articolo.

Ho scritto un codice CSS funzionante che però perde di efficacia in 
Internet Explorer se, invece dell'immagine menu messa come sfondo, 
inserisco l'immagine normalmente nell'HTML.

Mentre Firefox e Opera mantengono invariata la linkatura, con Internet 
Explorer sparisce e curiosamente funziona se ai tag LI o UL della lista 
link applico un colore di sfondo (che ovviamente non devo utilizzare).

Se gentilmente qualcuno mi può dare un suggerimento...
Grazie, Francesca

Incollo di seguito il codice CSS:

#testata {
	width:726px;
	margin:0 auto;
	position:relative;
	height:381px;

}
#testata ul {
	margin:0;
	padding:0;
	list-style:none;
	position:absolute;
	height:117px;
	width:160px;
	left:483px;
	top:25px;
}
#testata li {
	display:block;
	position:absolute;
	margin:0;
	padding:0;
}
#testata a span {
	display:none
}

#testata ul a {
	display:block;
	width:100%;
	height:100%;
}

#testata li#link1 {
	top:-25px;
	left:-483px;
	width:423px;
	height:280px;
}
#testata li#link2 {
	top:0;
	width:100px;
	height:23px;
}
#testata li#link3 {
	top:26px;
	width:174px;
	height:18px;
}
#testata li#link4 {
	top:50px;
	width:93px;
	height:20px;
}

#testata li#link5 {
	top:73px;
	width:80px;
	height:18px;
}

#testata li#link6 {
	top:97px;
	width:168px;
	height:18px;
}
#testata li#link7 {
	top:135px;
	left:50px;
	width:168px;
	height:15px;
}

e l'HTML:

<div id="testata"><img src="layout/testata.jpg" alt="" />
<ul>
	<li id="link1"><a href="xx.html"><span>xx</span></a></li>
	<li id="link2"><a href="xx.html"><span>xx</span></a></li>
	<li id="link3"><a href="xx.html"><span>xx</span></a></li>
	<li id="link4"><a href="xx.html"><span>xx</span></a></li>
	<li id="link5"><a href="xx.html"><span>xx</span></a></li>
	<li id="link6"><a href="xx.html"><span>xx</span></a></li>
	<li id="link7"><a href="xx.html"><span>xx</span></a></li>
</ul>
</div>