თვისება 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,
რომელიც ადგენს ელემენტის მინიმალურ სიგანეს