Problema con imagen flotando a la derecha en una lista ul li

[dacho]

Hola, de todas formas internet explorer no es el problema en este caso. el tema es que el float lo estas haciendo despues. Podes hacer varias cosas pero el tema esta estructuralmente en el html si no me falla mi conocimienta ja.

Fijate si mejor haces esto en el HTML:

Código HTML:

<ul class="listas">
<li><p>Adrián y Anita (Uruguay-Brasil-España)</p><img src="imagenes/adrian-y-anita.jpg" alt="Adrian y Anita" title="Adrian y Anita" class="imagen-listas" height="125" width="125"></li>
<li><p>Alfonso y Mónica (Cartagena)<p><img src="imagenes/alfonso-y-monica.jpg" alt="Alfonso y Mónica" title="Alfonso y Mónica" class="imagen-listas" height="125" width="125"></li>
</ul> 

y el css agregamos:

Código:

.listas {
	text-decoration:none;
	margin-left:20px;
	padding-left:20px;
	list-style-image: url(imagenes/imagen-listas.gif);
	list-style-position: inside;
	}
.listas ul{margin:0;
	padding:0;
	}
.listas li{
	height:125px;
	line-height:120px;
	margin:10px;
	padding:10px;		
}
.listas li p{
        margin: 0px;
        float:left;
        padding:0px;
}

.imagen-listas{
        margin-left:20px;
        float:right;
        margin-right:150px;
}

Creo que eso deberia solucionar el tema de la imagen a la derecha.

Sino otra solucion es colocar la imagen Antes del texto, osea dejar el html y poner la imagen asi:

Código HTML:

<ul class="listas">
<li><img src="imagenes/adrian-y-anita.jpg" alt="Adrian y Anita" title="Adrian y Anita" class="imagen-listas" height="125" width="125">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> 

Osea en este caso la imagen tiene que esta antes que el texto y con eso posiblemente tambien se solucione el problema.

Con respecto a centrar el background, del li te recomiendo que utilices la barra de firefox webdeveloper o Firebug y busques que esta pasando, porque se marca la diferencia entre una y otra. Antes de solucionar el problema hay que encontrarlo!....

ahhh.. mmm... Acaba de ver que utilizas list-style-image: url(imagenes/imagen-listas.gif); list-style-position: inside;... La verdad no utilizo eso para los fondos de las listas, simplemente hago un

list-style: none; y le pongo un
background-image: url(nombredeimage.jpg);
background-position: 10px 20px; (ubica la imagen de background)
Background-repeat: no-repeat;

Avisa si no te funciona lo que dije y vemos que puede estar mal de lo que dije :)