Características min-width en CSS

La propiedad min-width en CSS establece el ancho mínimo del elemento y evita que el valor usado de la propiedad width sea menor que el valor especificado en la propiedad min-width.

Funciones min-width css

Valor inicial	`0`
Aplicado a	Todos los elementos, excepto los elementos en línea no reemplazados, las columnas de la tabla y los grupos de columnas.
Heredable	No
Móvil	Sí
Valor calculado	Porcentaje, longitud absoluta o palabra reservada `auto`.

/* <length> longitudes */ 
min-width:  3.5em ;
/* <porcentaje> porcentajes */ 
min-width:  75%;
/* palabras reservadas */ 
min-width:  none ;
/* valores globales */ 
min-width: inherit;
min-width: initial;
min-width: unset;

El ancho del elemento se establecerá en el valor de la propiedad min-width sí es min-width mayor que max-width o width.

Ejemplos y aplicaciones en código

Usaremos el siguiente ejemplo, un elemento <div> actualmente igual al 40% elemento de visualización que lo contiene, pero no menor que un valor de propiedad de ancho min-width, a saber 350px:

< div >
  Contenido de texto
</ div >

Código CSS:

div {
  width: 40%;
  min-width: 350px;
}

Soporte de navegadores

Característica	Chrome	Firefox	IE	Ópera	Safari
Soporte básico	1.0	1.0	7.0	7.0	1.0

Características generales

auto

El valor predeterminado es sin ancho mínimo.

<length>

No se puede determinar el ancho mínimo en longitudes absolutas y los valores negativos.

<percentage>

Especifica el ancho mínimo como un porcentaje del ancho del elemento de bloque que contiene el elemento actual, y no se pueden usar valores negativos.

Estructura min-width css

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

Consulte también

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