Foros del Web » Creando para Internet » CSS »

li o ul copn mas de una imagen

Estas en el tema de li o ul copn mas de una imagen en el foro de CSS en Foros del Web. 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 ...
  #1 (permalink)  
Antiguo 27/02/2006, 05:16
Avatar de Necros  
Fecha de Ingreso: enero-2002
Ubicación: Catalunya
Mensajes: 431
Antigüedad: 15 años, 10 meses
Puntos: 0
li o ul copn mas de una imagen

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,
__________________
By NeCrOS
FrEe WoRlD is FrEe CoDE
http://www.NeCrOS.com
  #2 (permalink)  
Antiguo 27/02/2006, 18:13
Avatar de jesusbet
(Desactivado)
 
Fecha de Ingreso: mayo-2004
Ubicación: Monterrey, MX
Mensajes: 2.667
Antigüedad: 13 años, 7 meses
Puntos: 2
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;
  #3 (permalink)  
Antiguo 01/03/2006, 03:15
Avatar de Necros  
Fecha de Ingreso: enero-2002
Ubicación: Catalunya
Mensajes: 431
Antigüedad: 15 años, 10 meses
Puntos: 0
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;
}
__________________
By NeCrOS
FrEe WoRlD is FrEe CoDE
http://www.NeCrOS.com
  #4 (permalink)  
Antiguo 01/03/2006, 22:54
Avatar de kahlito
Colaborador
 
Fecha de Ingreso: marzo-2003
Ubicación: En el Estrecho y el mar
Mensajes: 2.893
Antigüedad: 14 años, 9 meses
Puntos: 60
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
  #5 (permalink)  
Antiguo 02/03/2006, 03:53
 
Fecha de Ingreso: febrero-2005
Mensajes: 396
Antigüedad: 12 años, 10 meses
Puntos: 1
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
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 04:48.