Свойство min-height

Свойство min-height элементнинг минимал баландлигини белгилайди. Свойство қиймати сифатида ўлчов бирликлари ёки қиймат йўқлигини англатувчи none калит сўзи қўлланилади.

Одатда, сузиб турадиган эни бор элемент (баландлик фоизларда белгиланган ёки умуман белгиланмаган, ва элемент ўз идорасидаги матн билан баландлиги жиҳатидан кенгайиши мумкин) учун белгиланади.

Агар минимал баландлик белгиланган бўлса - унддан пастрокка элементнинг баландлиги камаймайди. Агар min-height учун зарур бўлган миқдордаги матндан кам бўлса, элемент min-height баландлигига эга бўлади.

Агар матн кўп бўлса - элементнинг баландлиги матн микдорига қараб ҳисобланади.

Синтаксис

селектор {
	min-height: қиймат;
}

Мисол

Бу мисолда баландлик умуман белгиланмаган ва браузер томонидан мустақил равишда матн микдорига қараб ҳисобланади. Аммо, min-height свойства белгилангани сабабли, баландлик шу қийматдан пастрокка камаймайди, ҳатто унда матн бўлмаса ҳам:

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

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

Мисол

Элементга кўпроқ матн қўшайлик - шундай қилиб, блокнинг баландлиги бўйича тўлиб ташланиши юз беради. Бу ҳолда бизнинг блок жуда осонгина ўз баландлигини оширади:

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

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

Мисол

Солиштириш учун минимал баландликни олиб ташланган ва ўрнига height свойства белгиланган блокда нима бўлишини кўрамиз:

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

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

Шунингдек қаранг

элементнинг максимал баландлигини белгиловчи max-height свойства,
элементнинг максимал энини белгиловчи max-width свойства,
элементнинг минимал энини белгиловчи min-width свойства,