Proprietatea min-width

Proprietatea min-width stabilește lățimea minimă a elementului. Ca valoare a proprietății pot fi utilizate orice unități de măsură pentru dimensiuni sau cuvântul cheie none, care indică absența unei valori.

De obicei, este setată pentru un element cu lățime variabilă (lățimea este dată în procente sau nu este stabilită deloc, iar elementul se lățește în funcție de conținut). Dacă lățimea elementului este dată în procente - atunci când fereastra browserului se micșorează, ea se va reduce până când atinge valoarea min-width.

Sintaxă

selector {
	max-width: valoare;
}

Exemplu

În acest exemplu, lățimea reprezintă un procent din lățimea elementului părinte. Micșorați lățimea ferestrei browserului, și containerul se va micșora și el, pentru a se adapta la lățimea ferestrei browserului. Cu toate acestea, el se va micșora doar până la valoarea definită în min-width, adică 400px. Odată ce containerul atinge această lățime - el nu se va mai micșora:

<div id="elem"></div>

#elem {
	width: 70%;
	min-width: 400px;
	height: 300px;
	border: 1px solid black;
}

Exemplu

În acest exemplu, lățimea containerului este limitată pe ambele părți: el nu va putea deveni mai mare de 900px și mai mic de 400px:

<div id="elem"></div>

#elem {
	width: 70%;
	min-width: 400px;
	max-width: 900px;
	height: 100px;
	border: 1px solid black;
}

Vedeți și

proprietatea max-width,
care stabilește lățimea maximă a elementului
proprietatea max-height,
care stabilește înălțimea maximă a elementului
proprietatea min-height,
care stabilește înălțimea minimă a elementului