Свойство min-width

Свойството min-width задава минималната ширина на елемент. Стойности на свойството са всякакви единици за размери или ключовата дума none, която означава липса на стойност.

Обикновено се задава за елемент с плаваща ширина (ширината е зададена в проценти или не е зададена изобщо, а елементът по ширина се разширява от съдържанието си). Ако ширината на елемента е зададена в проценти - при намаляване на прозореца на браузъра тя ще се намалява, докато достигне стойността min-width.

Синтаксис

селектор {
	max-width: стойност;
}

Пример

В този пример ширината съставлява процент от ширината на родителя. Намалете прозореца на браузъра по ширина, и контейнерът също ще се намали, за да се настрои спрямо ширината на прозореца на браузъра. Обаче той ще се намалява само до величина, определена в min-width, това са 400px. Щом контейнерът достигне тази ширина - той ще спре да се намалява:

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

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

Пример

В този пример ширината на контейнера е ограничена от двете страни: той няма да може да стане по-голям от 900px и по-малък от 400px:

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

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

Вижте също

свойството max-width,
което задава максималната ширина на елемент
свойството max-height,
което задава максималната височина на елемент
свойството min-height,
което задава минималната височина на елемент