Vlastnost min-width

Vlastnost min-width nastavuje minimální šířku elementu. Jako hodnota vlastnosti slouží jakékoli jednotky pro rozměry nebo klíčové slovo none, které znamená absenci hodnoty.

Obvykle se nastavuje pro element s plovoucí šířkou (šířka je zadána v procentech nebo není zadána vůbec a element se šířkou roztahuje svým obsahem). Pokud je šířka elementu zadána v procentech - při zmenšení okna prohlížeče se bude zmenšovat, dokud nedosáhne hodnoty min-width.

Syntaxe

selektor {
	max-width: hodnota;
}

Příklad

V tomto příkladu je šířka uvedena v procentech ze šířky rodiče. Zmenšete okno prohlížeče na šířku a kontejner se také zmenší, aby se přizpůsobil šířce okna prohlížeče. Avšak bude se zmenšovat pouze do velikosti stanovené v min-width, to je 400px. Jakmile kontejner dosáhne této šířky - přestane se zmenšovat:

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

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

Příklad

V tomto příkladu je šířka kontejneru omezena z obou stran: nemůže být větší než 900px a menší než 400px:

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

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

Viz také

vlastnost max-width,
která nastavuje maximální šířku elementu
vlastnost max-height,
která nastavuje maximální výšku elementu
vlastnost min-height,
která nastavuje minimální výšku elementu