CSS - ubicar imagen en lista css personalizada.

 
Vista:

ubicar imagen en lista css personalizada.

Publicado por arrebeda (1 intervención) el 28/05/2008 10:38:18
Hola a todos. Tengo un problema que no consigo resolver. Y es que he creado una lista personalizada con css. Esta lista contiene un botón que se repite, que es cargado en la propiedad css: list-style-image:url(). Bien. Luego necesito que esta lista contenga en cada etiqueta <li></li> una imagen que cargaré en html. Bueno pues me funciona, pero no consigo alinear correctamente algunas de las imagenes (que son un total de 12) para que me coincidan con la posición del botón en altura, es decir, me queda la imagen más alta que el botón, pero en algunos casos y en otros no. Algunas de las imagenes tienen altura de 10px, y otras de 13px. Pero esto no influye en la colocación dentro del <li> ya que algunas que miden 13px de alto están bien, pero otras sin embargo no. Hasta el momento he tenido en cuenta que el botón que se repite se autoincrementa porque no tiene un tamaño height prefijado dentro del <ul></ul> pero luego he creado un tamaño fijo de 13 px en el <ul> e incluso le he puesto el mismo css al <li> con 13px de alto igualmente, pero sigue estando el mismo problema con respecto a la ubicación en la altura. Para facilitar la visión incluiré el código css:

ul{
margin-top:42px;
}

ul{
margin-bottom:10px;
list-style-type: none;
list-style-image: url(imaxes/button.png);
list-style-position:outside;
height:13px;
width:140px;
}

li {
list-style-type:none;
margin-bottom:10px;
height:13px;
width:140px;

}

Los he creado por separado para li y ul pero también los habia tenido como ul li en el mismo css, pero esto no influye. El primer <ul> con margin-top:42px, es para separar el ul de la parte superior del div (que por cierto me he olvidado mencionar que todo esto va dentro de un div ;-)).

Bueno si alguien puede facilitarme alguna solución, para ubicar las imagenes y que me coincidan en altura con el botón, ya que las imágenes tienen un tamaño fijo, y supongo que habrá que ubicarlas creando un <li> de tamaño fijo, pero esto ya lo he hecho y no me funciona.

Por favor, si alguien tiene la solución se lo agradeceré eternamente. Me juego el puesto. Un saludo.
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder