Foros del Web » Creando para Internet » CSS »

Como colocar lista

Estas en el tema de Como colocar lista en el foro de CSS en Foros del Web. Buenas! Acabo de comenzar con css y tengo un problemilla con una lista. Como haria para conseguir que una lista se me quedara tal q ...
  #1 (permalink)  
Antiguo 06/09/2006, 04:33
 
Fecha de Ingreso: marzo-2004
Mensajes: 338
Antigüedad: 13 años, 9 meses
Puntos: 2
Como colocar lista

Buenas! Acabo de comenzar con css y tengo un problemilla con una lista.
Como haria para conseguir que una lista se me quedara tal q asi, en dos columnas:

Código:
          Tema del día                              España

           Opinión                                    Aragón 

           Internacional                            Tecnología

           Política                                    Espectáculos 

           Economía                                 Deporte 

           Sociedad                                 Rádio + Tele

Este es el xhtml:

Código:
<ul class="lista_rss">
            <li>Tema del día</li>
            <li>Opinión</li>
            <li>Internacional</li>
            <li>Política</li>
            <li>Economía</li>
            <li>Sociedad</li>
            <li>España</li>
            <li>Aragón</li>
            <li>Tecnología</li>
            <li>Espectáculos</li>
            <li>Deporte</li>
            <li>Rádio + Tele</li>
         </ul>
He intentado crear dos clases una para los li de la izquierda y otra pa los li de la derecha pero al hacer esto se me ponen los li en linea y aunque los ponga a display: block siguen estando en linea.

Muchas gracias de antemano!.
__________________
SiMpLiFiKa
http://www.manitasdelweb.com

Última edición por chem; 06/09/2006 a las 05:45
  #2 (permalink)  
Antiguo 06/09/2006, 06:36
 
Fecha de Ingreso: julio-2005
Mensajes: 220
Antigüedad: 12 años, 4 meses
Puntos: 0
Código:
ul.lista_rss{
    float:left;
  }

<ul class="lista_rss">
            <li>Tema del día</li>
            <li>Opinión</li>
            <li>Internacional</li>
            <li>Política</li>
            <li>Economía</li>
            <li>Sociedad</li>
         </ul>
<ul class="lista_rss">
            <li>España</li>
            <li>Aragón</li>
            <li>Tecnología</li>
            <li>Espectáculos</li>
            <li>Deporte</li>
            <li>Rádio + Tele</li>
</ul>
Espero que te valga. Valido para IE, Firefox, Opera

Si quieres mas margen puedes probar a darle valores a margin.
  #3 (permalink)  
Antiguo 06/09/2006, 06:54
 
Fecha de Ingreso: marzo-2004
Mensajes: 338
Antigüedad: 13 años, 9 meses
Puntos: 2
Muchas gracias gorak! pero... ¿es posible hacerlo con un solo ul?
__________________
SiMpLiFiKa
http://www.manitasdelweb.com
  #4 (permalink)  
Antiguo 06/09/2006, 08:26
 
Fecha de Ingreso: marzo-2004
Mensajes: 338
Antigüedad: 13 años, 9 meses
Puntos: 2
Bueno despues de mucho probar he encontrado la forma de colocar una lista con un solo ul en dos columnas, aqui lo dejo por si le sirve a alguien en un futuro.

Lo que hay que hacer es flotar a la izquierda tanto el ul como los li. Una vez echo esto le damos un width al ul y le damos el mismo width partido por dos a los li, de esta manera se van colocando los li de dos en dos :).

Código:
ul{
  width: [N]px;
  float: left;
}

li{
  width: [N/2]px;
  float: left;
}
__________________
SiMpLiFiKa
http://www.manitasdelweb.com
  #5 (permalink)  
Antiguo 06/09/2006, 09:16
Avatar de JavierB
Colaborador
 
Fecha de Ingreso: febrero-2002
Ubicación: Madrid
Mensajes: 25.052
Antigüedad: 15 años, 9 meses
Puntos: 771
Eso ha estado bien chem

Se me ocurre una mejora que consiste en poner el ancho de los li en porcentaje:
Código:
li{
  width: 50%;
  float: left;
}
Saludos,
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 19:48.