li o ul copn mas de una imagen

[Necros]

Buenas,

deseo mostar un listado de elementos resultante de unia consulta a una base de datos, cada elemento quiero proporcionar la opción de editar y eliminar.Estas dos opciones las enlazo mediante <img>. El problema lo tengo que el li, me mete salto de carro en las imagenes, rompiendome la visual desdendete.

COmo lo quiero :

fdsfdsfds1 [img editar] [img eliminar]
fdsfdsfds12 [img editar] [img eliminar]
fdsfdsfds13 [img editar] [img eliminar]
dsaddsad2
fdsfdsfds21 [img editar] [img eliminar]

Que hace ahora :
fdsfdsfds1
[img editar]
[img eliminar]

Mi code :

<ul class="list"><li class="list"><ul class="list">'.$menu;
$string.='<img src="img/icons/Blue/icon_action/edit.gif" border=0>

El Style utilizado :


ul.list {
float: left;
width: 2em; /* width is changed */
margin: 0;
padding: 0;
list-style: none;
color: #454545;
}

li.list {
float: left;
display:block;
width: 2em;
margin: 0;
background-image: url(../img/icons/Blue/ui_misc/more.gif);
background-position: 0 3px;
background-repeat: no-repeat;
padding: 0 0 0 1.5em;
color: #454545;
}

Gracias,

[jesusbet]

si puedes quitar el código php te lo agradecería, para que se vea más limpio.

Parece que estás imprimiendo cada imagen dentro del ul:
<ul><li class="list">imagen</li><li class="list">imagen</li></ul>

Si te das cuenta, al li class="list" le estás dando un display: block; en el estilo, eso es lo que agrega el salto de línea.

En vez de block ponle inline:
display: inline;

[Necros]

Aqui tienes el code limpio ;) , tengo el mismo problema, me muestyra el listado, pero con las imagenes una debajo de la otra :(.

Gracias,


<ul class="list">
<li class="list">
<ul class="list">dsa
<li class="list">dsa
<img><img>
</li>
</ul>
</li>
</ul>


styles :


ul.list {
float: left;
display: inline;
width: 2em; /* width is changed */
margin: 0;
padding: 0;
list-style: none;
color: #454545;
}

li.list {
float: left;
display: inline;
width: 2em;
margin: 0;
background-image: url(../img/icons/Blue/ui_misc/more.gif);
background-position: 0 3px;
background-repeat: no-repeat;
padding: 0 0 0 1.5em;
color: #454545;
}

[kahlito]

Hola Necros.

Es necesario en tu diseño "float:left" ?, suponiendo que no te hace falta si lo quitas en tu último código te deben de ir perfectamente

Código HTML:

<style type="text/css">
ul.list {
display: inline;
width: 2em; /* width is changed */
margin: 0;
padding: 0;
list-style: none;
color: #454545;
}
li.list {
display: inline;
width: 2em;
margin: 0;
background-image: url(../img/icons/Blue/ui_misc/more.gif);
background-position: 0 3px;
background-repeat: no-repeat;
padding: 0 0 0 1.5em;
color: #454545;
}
</style> 

Saludosss

[Zerjillo]

Por otro lado en el código simplificado que pones hay errores:

no puedes poner texto dentro de un <ul> si no es a su vez dentro de un <li>. Vamos, que

Código:

<ul>poiu
  <li>asdf</li>
</ul>

es incorrecto porque "poiu" no esta dentro de un <li>

Un saludo

Zerjillo