CSS: min-height en Internet Explorer
11.Jan.2007 ~
3 Comentarios ~
4194 Lecturas
Todos conocemos los múltiples problemas de renderizado standard con la famosísima patera del innombrable, he aquí un hack para usar lo más parecido a min-height en dicha conjetura:
/* Para Internet Explorer */
* html #mnuIzda
{
height:100px;
border:1px solid #000;
background:#dedede;
}
/* Para el resto */
#mnuIzda
{
min-height:100px;
border:1px solid #000;
background:#dedede;
}
Comentarios
en lugar de hacer dos "clases" o "ids" para lo mismo, podemos hacer esto
#mnuIzda
{
height:100px;
min-height:100px;
border:1px solid #000;
background:#dedede;
}
es decir, los browsers van rendereando a medida que van leyendo lo que escribimos en el css, entonces si tenemos algo asi en alguna clase:
color:#000;
color:#f00;
el color final de la clase seria el "#f00" (o rojo).
por lo tanto si tenemos height y una linea despues min-height funciona igual.
porque el IE lee height y tiene ese valor para la altura, y cuando llega a min-height no la sabe interpretar (?!) y sigue de largo.
en cambio los otros navegadores que si funcionan bien con min-height, leen height y se quedan con ese valor, despues leen min-height y reemplazan al valor de la altura que antes tenia seteado con height por el valor de min-height.
juro que no lo trate de hacer confuso (?)
saludos
Esto lo haces para que cuando un texto se quede corto el IE no te joda el diseño.
Y funciona bien en los navegadores.
El problema es que el css asi hace que cuando el texto sea grande, el IE te hace scroll.
Que es el mismo problema que me da a mi con el truco:
min-height:200px;
height: auto !important;
height:200px;
que hacer? controlar el scroll? no se.
creo que lo podes solucionar con esto (usando visible, auto, scroll o hidden segun lo necesites):
overflow: hidden;
*overflow: visible; /* Hack para IE */
Saludos,