Discussion:
Dar altura a elementos li que tienen "display:inline"
Bernat Lleonart
2006-01-23 12:21:09 UTC
Permalink
Hola,

Llevo un rato intentando darle un alto en px a los elementos li de una
lista que tiene la propiedad "display: inline", y no hay manera.
Cuando le quito el "display: inline" sí que me deja darle la altura.

¿Sabéis cómo se puede solventar?

Gracias.
Alejandro Lillo
2006-01-23 12:25:11 UTC
Permalink
Post by Bernat Lleonart
Llevo un rato intentando darle un alto en px a los elementos li de una
lista que tiene la propiedad "display: inline", y no hay manera.
Cuando le quito el "display: inline" sí que me deja darle la altura.
Es un elemento de línea, así que contrólalo con line-height.

--
Alejandro Lillo
www.nordic-design.net
Bernat Lleonart
2006-01-23 12:32:22 UTC
Permalink
Post by Alejandro Lillo
Es un elemento de línea, así que contrólalo con line-height.
--
Lo que pasa es que el li tiene una imagen de fondo, y quiero darle una
altura y un ancho fijos para que se vea la imagen entera. Lo que veo
con line-height es que varía la posición vertical del li, pero no su
altura.
Rafael García Lepper
2006-01-23 12:37:10 UTC
Permalink
Post by Bernat Lleonart
Post by Alejandro Lillo
Es un elemento de línea, así que contrólalo con line-height.
--
Lo que pasa es que el li tiene una imagen de fondo, y quiero darle una
altura y un ancho fijos para que se vea la imagen entera. Lo que veo
con line-height es que varía la posición vertical del li, pero no su
altura.
Hola,

Le has dado la misma altura o más al ol o ul que contienen el li?

Saludos

Rafa


biosfera 4
desarrollo web | asesoramiento musical | open source
c/ Real 36 1ºA
28230 Las Rozas de Madrid
tel. 916377043
fax. 916375147
http://www.biosfera4.com
***@biosfera4.com
Bernat Lleonart
2006-01-23 12:52:31 UTC
Permalink
Post by Rafael García Lepper
Hola,
Le has dado la misma altura o más al ol o ul que contienen el li?
Saludos
Rafa
Hola,

He probado a darle la misma altura al ul que al li, a darle más altura
al ul que al li, y a no ponerle altura al ul, pero nunca consigo
variar la altura del li.

Un saludo.
Víctor Pimentel Rodríguez
2006-01-23 12:39:50 UTC
Permalink
Prueba a ponerle display:block y float:letf (para emular inline) y
entonces sí que podrás ponerle ancho y altura fijo :)
Post by Bernat Lleonart
Post by Alejandro Lillo
Es un elemento de línea, así que contrólalo con line-height.
--
Lo que pasa es que el li tiene una imagen de fondo, y quiero darle una
altura y un ancho fijos para que se vea la imagen entera. Lo que veo
con line-height es que varía la posición vertical del li, pero no su
altura.
_______________________________________________
Lista de distribución Ovillo
Puedes modificar tus datos o desuscribirte en la siguiente
dirección: http://ovillo.org/mailman/listinfo/ovillo
Choan C. Gálvez
2006-01-23 12:51:26 UTC
Permalink
Post by Víctor Pimentel Rodríguez
Prueba a ponerle display:block y float:letf (para emular inline) y
entonces sí que podrás ponerle ancho y altura fijo :)
Y cambiar tus problemas por otros.

Una puntualización: cuando flotamos un elemento, añadirle un `display:
block;` es completamente irrelevante, ya que el `float` lo implica (ver
especificación).

En todo caso, sí es interesante engañar al navegador (a IE, vaya)
diciéndole que

elemento {
float: left;
display: inline;
}

Así se evita el bug del doble margen en Win/IE. Y nadie resulta herido.

(Disculpen ustedes mi salida de tiesto, pero es que las redundancias me
provocan ardor de estómago.)

Salud,
Choan
Post by Víctor Pimentel Rodríguez
Post by Bernat Lleonart
Post by Alejandro Lillo
Es un elemento de línea, así que contrólalo con line-height.
--
Lo que pasa es que el li tiene una imagen de fondo, y quiero darle una
altura y un ancho fijos para que se vea la imagen entera. Lo que veo
con line-height es que varía la posición vertical del li, pero no su
altura.
Orange at GMail
2006-01-23 12:48:53 UTC
Permalink
Para los elementos en línea NO se puede especificar ancho y alto, según la
especificación CSS. Que Explorer lo permita es un Bug

Si por fuerza has de declararlo inline (que igual no hace falta ;) tus
opciones para controlar su tamaño pasan por el padding y el line-height (y
puede que alguna otra estratagema, pero bueno)

Ve con cuidado con los paddings ya que IE5.0 no te los respetará, así que
ojo cono ellos
Post by Bernat Lleonart
Post by Alejandro Lillo
Es un elemento de línea, así que contrólalo con line-height.
--
Lo que pasa es que el li tiene una imagen de fondo, y quiero darle una
altura y un ancho fijos para que se vea la imagen entera. Lo que veo
con line-height es que varía la posición vertical del li, pero no su
altura.
_______________________________________________
Lista de distribución Ovillo
http://ovillo.org/mailman/listinfo/ovillo
--
Orange at GMail
Choan C. Gálvez
2006-01-23 12:57:11 UTC
Permalink
Post by Orange at GMail
Para los elementos en línea NO se puede especificar ancho y alto, según la
especificación CSS. Que Explorer lo permita es un Bug
Si por fuerza has de declararlo inline (que igual no hace falta ;) tus
opciones para controlar su tamaño pasan por el padding y el line-height (y
puede que alguna otra estratagema, pero bueno)
Ve con cuidado con los paddings ya que IE5.0 no te los respetará, así que
ojo cono ellos
Para que IE 5.0 los "respete":

selector {
_height: .1%; /* el elemento tendrá layout */
padding: 2px 1em;
}

Véase On having Layout [1].

[1]: http://www.satzansatz.de/cssd/onhavinglayout.html

Salud,
Choan
Post by Orange at GMail
Post by Bernat Lleonart
Post by Alejandro Lillo
Es un elemento de línea, así que contrólalo con line-height.
--
Lo que pasa es que el li tiene una imagen de fondo, y quiero darle una
altura y un ancho fijos para que se vea la imagen entera. Lo que veo
con line-height es que varía la posición vertical del li, pero no su
altura.
Orange at GMail
2006-01-23 13:26:17 UTC
Permalink
Muy interesante, garcias
:)

Ya puestos, hagamos que valide

selector {
height: .1%; /* el elemento tendrá layout IE5.x*/
heigh\t: auto;
padding: 2px 1em;
}

Igual habría que contemplar Opera, y ya la cosa se parecería mucho al
sempiterno Box Model HAck
Post by Choan C. Gálvez
Post by Orange at GMail
Para los elementos en línea NO se puede especificar ancho y alto, según
la
Post by Orange at GMail
especificación CSS. Que Explorer lo permita es un Bug
Si por fuerza has de declararlo inline (que igual no hace falta ;) tus
opciones para controlar su tamaño pasan por el padding y el line-height
(y
Post by Orange at GMail
puede que alguna otra estratagema, pero bueno)
Ve con cuidado con los paddings ya que IE5.0 no te los respetará, así
que
Post by Orange at GMail
ojo cono ellos
selector {
_height: .1%; /* el elemento tendrá layout */
padding: 2px 1em;
}
Véase On having Layout [1].
[1]: http://www.satzansatz.de/cssd/onhavinglayout.html
Salud,
Choan
Post by Orange at GMail
Post by Bernat Lleonart
Post by Alejandro Lillo
Es un elemento de línea, así que contrólalo con line-height.
--
Lo que pasa es que el li tiene una imagen de fondo, y quiero darle una
altura y un ancho fijos para que se vea la imagen entera. Lo que veo
con line-height es que varía la posición vertical del li, pero no su
altura.
_______________________________________________
Lista de distribución Ovillo
http://ovillo.org/mailman/listinfo/ovillo
--
Orange at GMail
Loading...