Foros del Web » Creando para Internet » CSS »

Lista <ul> en columnas

Estas en el tema de Lista <ul> en columnas en el foro de CSS en Foros del Web. Hola a todos ¿Alguien sabe si es posible crear una lista (con ul y li), que despliegue sus items en columnas? Algo asi: - 1º ...
  #1 (permalink)  
Antiguo 22/11/2005, 16:01
 
Fecha de Ingreso: agosto-2001
Ubicación: Gran Canaria (España)
Mensajes: 430
Antigüedad: 16 años, 4 meses
Puntos: 0
Lista <ul> en columnas

Hola a todos

¿Alguien sabe si es posible crear una lista (con ul y li), que despliegue sus items en columnas? Algo asi:

- 1º Item - 2º Item - 3º Item
- 4º Item - 5º Item - 6º Item
- 7º Item - 8º Item - 9º Item
........... etc...

Gracias a todos
  #2 (permalink)  
Antiguo 22/11/2005, 16:12
Avatar de baccxus  
Fecha de Ingreso: mayo-2005
Ubicación: Panama city, Panama, Panama
Mensajes: 870
Antigüedad: 12 años, 6 meses
Puntos: 17
Usa la función display:inline para la etiqueta <li>

Código:
.class li {
display: inline
}
Código HTML:
<ul class="class">
<li>item 1</li>
<li>item 2</li>
<li>item 3</li>
<li>item 4</li>
</ul> 
Saludos
__________________
Al final del día hablar es gratis, codificar no lo es

Última edición por baccxus; 22/11/2005 a las 16:46
  #3 (permalink)  
Antiguo 22/11/2005, 16:20
 
Fecha de Ingreso: agosto-2001
Ubicación: Gran Canaria (España)
Mensajes: 430
Antigüedad: 16 años, 4 meses
Puntos: 0
Mmmm... no se muestran.... he probado con otros valores de display y tampoco...
  #4 (permalink)  
Antiguo 22/11/2005, 16:30
Avatar de baccxus  
Fecha de Ingreso: mayo-2005
Ubicación: Panama city, Panama, Panama
Mensajes: 870
Antigüedad: 12 años, 6 meses
Puntos: 17
Estás usando una DTD que valide tu página?, si no es así, coloca esto al principio de tu código y borra la etiqueta <html>:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
__________________
Al final del día hablar es gratis, codificar no lo es
  #5 (permalink)  
Antiguo 22/11/2005, 16:37
 
Fecha de Ingreso: agosto-2001
Ubicación: Gran Canaria (España)
Mensajes: 430
Antigüedad: 16 años, 4 meses
Puntos: 0
Ya lo tenia colocado...

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="es" lang="es">
  #6 (permalink)  
Antiguo 22/11/2005, 16:46
Avatar de baccxus  
Fecha de Ingreso: mayo-2005
Ubicación: Panama city, Panama, Panama
Mensajes: 870
Antigüedad: 12 años, 6 meses
Puntos: 17
Ah... tienes que darle un ancho, porque sino tomará todo el renglón.

.class li {
display: inline;
width: 100px;
}
__________________
Al final del día hablar es gratis, codificar no lo es
  #7 (permalink)  
Antiguo 22/11/2005, 16:58
 
Fecha de Ingreso: agosto-2001
Ubicación: Gran Canaria (España)
Mensajes: 430
Antigüedad: 16 años, 4 meses
Puntos: 0
Que va, no hay forma, te digo lo que tengo:
En el archivo style.css
.class li {display: inline; width: 500px}

En el archivo html:
<ul class="class">
<li>Uno</li>
<li>Dos</li>
<li>Tres</li>
<li>Cuatro</li>
<li>Cinco</li>
<li>Seis</li>
</ul>

Mi intencion es que los muestre de tres en tres...
  #8 (permalink)  
Antiguo 22/11/2005, 17:01
Avatar de baccxus  
Fecha de Ingreso: mayo-2005
Ubicación: Panama city, Panama, Panama
Mensajes: 870
Antigüedad: 12 años, 6 meses
Puntos: 17
bueno si es así, dále un display:block; y float:left y bájale el tamaño al width
__________________
Al final del día hablar es gratis, codificar no lo es
  #9 (permalink)  
Antiguo 22/11/2005, 17:08
 
Fecha de Ingreso: agosto-2001
Ubicación: Gran Canaria (España)
Mensajes: 430
Antigüedad: 16 años, 4 meses
Puntos: 0
Que va, creo que sera mejor que utilice una tabla...

Muchas gracias por tu ayuda

Un saludo
  #10 (permalink)  
Antiguo 22/11/2005, 17:20
Avatar de baccxus  
Fecha de Ingreso: mayo-2005
Ubicación: Panama city, Panama, Panama
Mensajes: 870
Antigüedad: 12 años, 6 meses
Puntos: 17
pon tu página y buscamos una solución
__________________
Al final del día hablar es gratis, codificar no lo es
  #11 (permalink)  
Antiguo 22/11/2005, 17:26
 
Fecha de Ingreso: agosto-2001
Ubicación: Gran Canaria (España)
Mensajes: 430
Antigüedad: 16 años, 4 meses
Puntos: 0
no está aun online...
  #12 (permalink)  
Antiguo 22/11/2005, 17:39
Avatar de RoQ
RoQ
 
Fecha de Ingreso: abril-2005
Mensajes: 771
Antigüedad: 12 años, 7 meses
Puntos: 0
Cita:
Iniciado por daniph
Que va, no hay forma, te digo lo que tengo:
En el archivo style.css
.class li{display: inline; width: 500px}
borra el espacio entre el li y la llave {
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 07:56.