¿Alguien sabe que puedo hacer que la altura mínima funcione con los últimos navegadores? Estoy usando tablas CSS y parece ignorar la altura mínima.
<div style="background-color: red; display: table; min-height: 100px;">
abc
</div>
¿Alguien sabe que puedo hacer que la altura mínima funcione con los últimos navegadores? Estoy usando tablas CSS y parece ignorar la altura mínima.
<div style="background-color: red; display: table; min-height: 100px;">
abc
</div>
Respuestas:
Cuando se utilizan mesas, la altura es esencialmente la altura mínima, ya que las mesas siempre se estiran. Simplemente deshazte del "min-" y funcionará como esperas.
display: table-cell
elementos más internos .
height
funciona y min-height
no en Chrome 37, Safari 7 y FF 32 en mac. IE11 en Win 8.1 proporciona el comportamiento correcto en ambos. jsfiddle.net/nuwcyvwn/1
Utilizar height: 1px;
sobre la mesa o cualquier valor. Básicamente, necesitas darle a la mesa algo de altura para que funcione min-height
. Tener solo min-height
no funcionará en tablas en Firefox.
Siempre que esté utilizando display:table;
o cualquier propiedad más profunda como, display:table-cell;
considere usar en height
lugar de min-height
. Como en las tablas altura = altura mínima considerando la función de autoexpansión en ellas.
Solución para Firefox
Agregue altura para desbloquear la configuración de la altura mínima
div {
display: table;
width: 100%;
height: 0;
min-height: 100px;
}
El número de altura puede ser cualquier otro valor real menor o igual a la altura mínima para que funcione como se esperaba.