Definición de .max-height aplicado en CSS
La propiedad .max-height
en CSS se usa para establecer la altura máxima de un elemento especificado. Los autores pueden usar cualquiera de los valores de longitud siempre que sean un valor positivo. .max-height
anula la altura, pero Min-Weight siempre anula .max-height
.
Ejemplo de empleo de la propiedad max-height
Si te gustaría emplear esta propiedad de CSS en tu hoja de estilos, hazlo de esta forma:
.wrapper {
height: 100%; /* full height of the content box */
max-height: 20em; /* requires an absolute value for height. */
}
.wrapper {
height: 50px;
max-height: 20px; /* Will be AT MOST 20px tall : overrides height */
}
.wrapper {
min-height: 400px; /* overrides height and max-height */
height: 200px;
max-height: 300px;
}
Sintaxis de .max-height en CSS
max-height: none|length|initial|inherit;
Valores
Valor | Descripción | Manifestación |
---|---|---|
ninguna | Sin altura máxima. esto es por defecto | |
longitud | Define la altura máxima en px, cm, etc. | |
% | Define la altura máxima en porcentaje del bloque contenedor | |
inicial | Establece esta propiedad en su valor predeterminado. | |
heredar | Hereda esta propiedad de su elemento principal. |
Exploradores compatibles con .max-height
Los números de la tabla especifican la primera versión del navegador que es absolutamente compatible con la propiedad.
Los números seguidos de -webkit- detallan la primera versión que funcionó con un prefijo.
Property | Chrome | Internet Explorer / Edge | Firefox | Safari | Opera |
---|---|---|---|---|---|
max-width | 1.0 | 7.0 | 1.0 | 2.0.2 | 7.0 |