Hola dacho.
He probado todos tus ejemplos y por fin se arregla, simplemente como bien decías tenía que colocar la imagen antes del texto por el tema del float que lo hacía al revés.
había probado de todo menos esa opción, estoy perdiendo facultades...
El fondo de las listas también sale ubicado correctamente
Código HTML:
<ul class="listas">
<li><img src="imagenes/adrian-y-anita.jpg.jpg" width="125" height="125" alt="Adrián y Anita" class="imagen-listas" />Adrián y Anita (Uruguay-Brasil-España)</li>
<li><img src="imagenes/alfonso-y-monica.jpg" alt="Alfonso y Mónica" title="Alfonso y Mónica" class="imagen-listas" height="125" width="125" />Alfonso y Mónica (Cartagena)</li>
</ul>
Código HTML:
<style type="text/css">
.listas {
text-decoration:none;
margin-left:20px;
padding-left:20px;
}
.listas ul{margin:0;
padding:0;
}
.listas li{
height:125px;
line-height:120px;
margin:10px;
padding:10px;
padding-left:40px;
list-style: none;
background-image: url(imagenes/imagen-listas.gif);
background-position: 0 53px;
background-repeat: no-repeat;
}
.imagen-listas{
margin-left:20px;
float:right;
margin-right:150px;
}
</style>
También en probado la otra forma con los p y el width pero me da problemas, en Iexplorer 6 si va bien, es raro...
Muchas gracias por tu ayuda