min-width प्रॉपर्टी

min-width प्रॉपर्टी एलिमेंट की न्यूनतम चौड़ाई सेट करती है। इस प्रॉपर्टी के वैल्यू के रूप में कोई भी आकार की यूनिट या कीवर्ड none हो सकता है, जो कोई वैल्यू न होने को दर्शाता है।

आमतौर पर फ्लोटिंग चौड़ाई वाले एलिमेंट के लिए सेट की जाती है (चौड़ाई प्रतिशत में दी गई है या बिल्कुल नहीं दी गई है, और एलिमेंट अपनी कॉन्टेंट के अनुसार चौड़ाई में फैलता है)। यदि एलिमेंट की चौड़ाई प्रतिशत में दी गई है - ब्राउज़र विंडो को छोटा करने पर यह तब तक घटती रहेगी, जब तक कि यह min-width के वैल्यू तक नहीं पहुँच जाती।

सिंटैक्स

cssसिलेक्टर {
  max-width: वैल्यू;
}

उदाहरण

इस उदाहरण में चौड़ाई पैरेंट की चौड़ाई का प्रतिशत है। ब्राउज़र विंडो की चौड़ाई कम करें, और कंटेनर भी ब्राउज़र विंडो की चौड़ाई के अनुरूप ढलने के लिए छोटा हो जाएगा। हालाँकि, यह केवल उस वैल्यू तक ही घटेगा, जो min-width में परिभाषित है, यह 400px है। जैसे ही कंटेनर इस चौड़ाई तक पहुँचेगा - यह घटना बंद कर देगा:

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

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

Результат:

उदाहरण

इस उदाहरण में कंटेनर की चौड़ाई दोनों तरफ से सीमित है: यह 900px से अधिक और 400px से कम नहीं हो सकेगी:

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

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

Результат:

यह भी देखें