सीएसएस ग्रिड में minmax फ़ंक्शन
auto-fill के साथ
minmax फ़ंक्शन को निर्दिष्ट करना बहुत सुविधाजनक है,
जो कॉलम की चौड़ाई की एक सीमा निर्धारित करता है
न्यूनतम से अधिकतम मान तक।
यदि कंटेनर की चौड़ाई सभी कॉलम को समाहित नहीं कर सकती है,
तो उनमें से कुछ एक नई पंक्ति में चले जाएंगे, जबकि पंक्ति में कॉलम
उसमें समान रूप से वितरित हो जाएंगे।
आइए एक उदाहरण देखें। कॉलम प्लेसमेंट के विभिन्न वेरिएंट देखने के लिए पृष्ठ की चौड़ाई बदलें:
<div id="parent">
<div>1</div>
<div>2</div>
<div>3</div>
<div>4</div>
<div>5</div>
<div>6</div>
<div>7</div>
<div>8</div>
</div>
#parent {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
border: 2px solid #696989;
padding: 10px;
}
#parent > div {
padding: 10px;
border: 1px solid #696989;
}
:
minmax फ़ंक्शन के काम को प्रदर्शित करने वाला
एक उदाहरण लिखें।
