Atribuut min-height

Atribuut min-height määrab elemendi minimaalse kõrguse. Atribuudi väärtuseks on mis tahes mõõtühikud mõõtmete jaoks või märksõna none, mis tähendab väärtuse puudumist.

Tavaliselt määratakse see elemendile ujuvaga laiusega (kõrgus on määratud protsentides või pole üldse määratud, ja element kõrgusena laieneb oma sisu järgi).

Kui minimaalne kõrgus on määratud - siis väiksemaks sellest kõrgusest element ei saa. Kui teksti on vähem kui vaja min-height jaoks, siis elemendi kõrgus on min-height.

Kui teksti on rohkem - elemendi kõrgus arvutatakse sõltuvalt teksti hulgast.

Süntaks

valija {
	min-height: väärtus;
}

Näide

Selles näites kõrgus pole üldse määratud ja brauser arvutab selle iseseisvalt sõltuvalt teksti hulgast. Kuid, kuna atribuut min-height on määratud, siis kõrgus sellest väärtusest väiksemaks ei muutu, isegi kui teksti selles pole üldse:

<div id="elem">
	Lorem ipsum dolor sit amet.
</div>

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

Näide

Lisame elemendile rohkem teksti - nii, et toimuks ploki ülevool kõrgusega. Sellisel juhul meie plokk lihtsalt suurendab oma kõrgust:

<div id="elem">
	some long text
</div>

#elem {
	min-height: 100px;
	width: 300px;
	border: 1px solid black;
	text-align: justify;
}

Näide

Võrdluseks vaatame, mis juhtub plokiga, kui eemaldada minimaalne kõrgus, ja selle asemel määrata atribuut height:

<div id="elem">
	some long text
</div>

#elem {
	height: 100px;
	width: 300px;
	border: 1px solid black;
	text-align: justify;
	margin-bottom: 50px;
}

Vaata ka

atribuut max-height,
mis määrab elemendi maksimaalse kõrguse
atribuut max-width,
mis määrab elemendi maksimaalse laiuse
atribuut min-width,
mis määrab elemendi minimaalse laiuse