Foros del Web » Creando para Internet » CSS »

"width" en elementos "inline"

Estas en el tema de "width" en elementos "inline" en el foro de CSS en Foros del Web. Cordial saludo, mi duda es la siguiente: Tengo una lista desordenada <ul> dentro de un <div>, dentro de la lista tengo varios <li> que estan ...
  #1 (permalink)  
Antiguo 09/11/2010, 18:26
 
Fecha de Ingreso: junio-2008
Ubicación: Colombia
Mensajes: 207
Antigüedad: 9 años, 5 meses
Puntos: 12
"width" en elementos "inline"

Cordial saludo, mi duda es la siguiente:

Tengo una lista desordenada <ul> dentro de un <div>, dentro de la lista tengo varios <li> que estan en modo inline mediante la propiedad display:inline, pero lo que quiero es asignar un ancho definido a cada uno de estos <li> para que la presentacion no se vea tan desordenada, algo como decir:

div ul li{
display: inline;
width: 200px;
}

Pero no funciona y segun he leido no se puede definir un ancho fijo en elementos inline, asi que podria hacer al respecto?.

Se que con tablas es mas sencillo el asunto pero quiero darme la posibilidad de ir prescindiendo de ellas y usar CSS más seguido.

Gracias de antemano.
  #2 (permalink)  
Antiguo 09/11/2010, 18:51
 
Fecha de Ingreso: junio-2008
Mensajes: 97
Antigüedad: 9 años, 6 meses
Puntos: 2
Respuesta: "width" en elementos "inline"

display: block; enves de display: inline;
  #3 (permalink)  
Antiguo 10/11/2010, 03:55
 
Fecha de Ingreso: junio-2009
Ubicación: Madrid
Mensajes: 46
Antigüedad: 8 años, 6 meses
Puntos: 7
Respuesta: "width" en elementos "inline"

Hola,

Supongo que al ponerles display:inline lo que quieres hacer es un menú en línea o algo similar. Si quieres darle anchura los puedes poner como block, y para que queden en linea los flotas:

Código CSS:
Ver original
  1. div ul li{
  2. display: block;
  3. width: 200px;
  4. float: left;
  5. }

Precisamente acabo de preparar un tutorial visual sobre floats, por si te interesa.

Saludos
__________________
Quizá te interese mi Tutorial de JavaScript Orientado a Objetos.

Nuevo: CSS Floats: Tutorial Visual
  #4 (permalink)  
Antiguo 10/11/2010, 06:50
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 10 años, 6 meses
Puntos: 538
Respuesta: "width" en elementos "inline"

Tiene tres etiquetas: ul/li/a
Desea que se muestren en línea los enlaces, ¿cierto?
Los li deben ser por lo tanto elementos en línea, y normalmente flotados.
Quien debe llevar el tamaño son los enlaces /a/
Declárelos de bloque, con su padding correspondiente para lograr la separación horizontal y el alineado vertical centrado. Y si lo precisa con un tamaño, quizás mínimo, pero eso ya depende de otros factores.

Un ejemplo muy básico: http://bit.ly/9xyZp2

Etiquetas: elementos
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 18:55.