li con imágen de varias líneas

[elveru]

Hola a todos, soy nuevo en el grupo...

Bueno ahí va mi problema: tengo un li con una imágen que queda muy bonito cuando el li es de una sola línea, pero cuando tiene varias no queda la imágen en la primera línea, sino en el medio.

Esto es lo que tengo:
.liconimagen {
background:url(./images/iconoli.gif) no-repeat left center;
list-style-type:none;
padding:0em 0em 0em 1em; /*en firefox debería ser 1em , y en ie 0em*/
}

si pongo el backgorund "top" no queda centrado verticalmente en las li de una sóla línea.

¿Alguien sabe como hacerlo?

[JavierB]

Hola elveru. Bienvenido al foro.

Prueba cambiando esta línea:

background:url(./images/iconoli.gif) no-repeat left top;

Saludos,

[elveru]

Muchas gracias por tu rápida respuesta....

El problema que tengo al poner el "top" es que la imágen no queda centrada verticalmente en la línea, queda un poco más alta que el texto, por eso estoy buscando otra solución (si la hay...)

Gracias!

[kahlito]

Hola elveru, ¿podrías poner más parte de los códigos que utilizas o algún ejemplo?

[elveru]

Ahí va un poco de código...

.liconimagen {
background:url(./images/iconoli.gif) no-repeat left center;
list-style-type:none;
padding:0em 0em 0em 1em; /*en firefox debería ser 1em , y en ie 0em*/
}


<ul>
<li class="liconimagen"><strong>aqui el título:</strong> bla, bla bla bla, bla blabla, bla blabla, bla blabla, bla blabla, bla blabla, bla blabla, bla blabla, bla blabla, bla blabla, bla blabla, bla blabla, bla blabla, bla blabla, bla blabla, bla blabla, bla blabla, bla blabla, bla blabla, bla blabla, bla blabla, bla blabla, bla blabla, bla blabla, bla blabla, bla blabla, bla blabla, bla blabla, bla blabla, bla blabla, bla blabla, bla blabla, bla blabla, bla blabla, bla blabla, bla blabla, bla blabla, bla blabla, bla blabla, bla blabla, bla blabla, bla blabla, bla blabla, bla blabla, bla blabla, bla blabla, bla blabla, bla blabla, bla blabla, bla blabla, bla blabla, bla blabla, bla blabla, bla blabla, bla blabla, bla blabla, bla blabla, bla bla</li>
<li>otro cosa en solo una línea.</li>
.....

[derkenuke]

Prueba quizás poniendo que aparezca en la mitad de la primera línea:
background:url(./images/iconoli.gif) no-repeat left 0.5em;

No sé lo correcto que puede resultar ésto, no lo he probado.


Un saludo.