Ciao a tutti.
Sto cercando di fare una pagina di prodotti, posto il link a una pagina di esempio

Vorrei avere vari link testuali sulla sinistra che corrispondono a immagini sulla destra. E vorrei che passando il mouse sul link testuale si "evidenzi" anche la foto corrispondente, e viceversa.

Il problema: Al primo testo corrisponde l'ultima foto, invece vorrei che fosse la prima ---colpa del float:right, ma non so come altro fare... Spero si capisca cosa intendo...

Ho fatto così:
codice:
<div id="content-prodotti">
<ul>
[*]Testo1[img]img/00foto1.png[/img], 
  Testo2[img]img/00foto2.png[/img], 
  Testo3[img]img/00foto3.png[/img]
  <div class="clear"></div>
  [*]Testo4[img]img/00foto4.png[/img], 
  Testo5[img]img/00foto5.png[/img]
  <div class="clear"></div>
[/list]
</div>
e poi nel css
codice:
#content-prodotti {
	margin:0;
	padding: 0 0 0 260px;
}
#content-prodotti ul{
	margin:10px 40px 0 0;
	padding:0;
	list-style:none
}
#content-prodotti ul li{
	font-size: 15px;
	margin:0;
	padding:30px 0;
	border-bottom: solid #999 1px;
}
#content-prodotti ul li a:link, #content-prodotti ul li a:visited{
	color: #006;
	font-weight:bold;
	border: solid #fff 2px;
}
#content-prodotti ul li a:hover, #content-prodotti ul li a:focus{
	border: solid #999 2px;
}
img#prod{
	float: right;
	position: relative;
	top:-40px;
}
a:link img#prod, a:visited img#prod {
	border: solid #FFF 2px;
}
a:hover img#prod, a:focus img#prod {
	border: solid #999 2px;
}
Aiutino?
Grazie, ciao