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