Características min-height en CSS

Características min-height en CSS

La propiedad min-height en CSS establece la altura mínima del elemento y evita que el valor usado de la propiedad height sea ​​menor que el valor especificado en la propiedad min-height.

Funciones min-height css

Valor inicial0
Aplicado aTodos los elementos, excepto los elementos en línea no reemplazados, las columnas de la tabla y los grupos de columnas.
HeredableNo
Móvil
Valor calculadoPorcentaje (%), longitud absoluta o palabra reservada auto.
/* <length> longitudes */ 
min-height:  3.5em;
/* <porcentaje> porcentajes */ 
min-height:  75%;
/* palabras reservadas */ 
min-height:  none;
/* valores globales */ 
min-height: inherit;
min-height: initial;
min-height: unset;

La altura del elemento se establecerá en el valor de la propiedad min-height sí es min-height mayor que max-heightheight.

Ejemplos y aplicaciones en código

Usaremos el siguiente ejemplo <div>, la altura de  un elemento 30% no es menor que el valor de la propiedad  min-height, a saber 150px:

< div > 
Contenido de texto
</ div >

Código CSS:

div {
  height: 30%;
  min-height: 150px;
}

Soporte de navegadores

CaracterísticaChromeFirefoxIEÓperaSafari
Soporte básico1.01.07.07.01.0

Características generales

auto

El valor predeterminado es sin altura mínima.

<length>

Determine la altura mínima en longitudes absolutas y no se pueden utilizar valores negativos.

<percentage>

Especifica la altura mínima como porcentaje de la altura del elemento de bloque que contiene el elemento actual. No se pueden utilizar valores negativos.

Estructura min-height css

min-height: <length> | <percentage> | auto;

Consulte también

  • La página de cada una de las propiedades  widthheight que se encarga de configurar las dimensiones del elemento.
  • Página de propiedades  max-height que establece la altura máxima del elemento.
  • Página de propiedades  max-width que establece el ancho máximo del elemento.
  • La página de propiedades  min-width que establece el ancho mínimo del elemento.