CSS grid-auto-flow गुण

परिभाषा और उपयोग

grid-auto-flow गुण अपने आपसे जमा होने वाली वस्तु को ग्रिड में कैसे जमा करेगा को नियंत्रित करता है।

अन्य संदर्भ:

CSS शिक्षा:CSS ग्रिड लेआउट

उदाहरण

उदाहरण 1

स्वचालित रूप से प्रविष्ट होने वाली वस्तु को स्तम्भ द्वारा जमा करें:

.grid-container {
  display: grid;
  grid-auto-flow: column;
}

खुद से प्रयोग करें

उदाहरण 2

सभी खाली स्थानों को भरने के लिए "dense" मान जोड़ें:

.grid-container {
  display: grid;
  grid-auto-flow: row dense;
}

खुद से प्रयोग करें

CSS व्याकरण

grid-auto-flow: row|column|dense|row dense|column dense;

गुण मान

मान वर्णन
row मूलभूत मान। प्रत्येक पंक्ति को भरकर वस्तु को रखें。
column प्रत्येक स्तम्भ को भरकर वस्तु को रखें。
dense ग्रिड में किसी भी खाली स्थान को भरने के लिए वस्तु रखें。
row dense प्रत्येक पंक्ति को भरकर वस्तु को रखें, और ग्रिड में किसी भी खाली स्थान को भरें。
column dense प्रत्येक स्तम्भ को भरकर वस्तु को रखें, और ग्रिड में किसी भी खाली स्थान को भरें。

तकनीकी विवरण

मूलभूत मान: row
विरासत: नहीं
एनीमेशन निर्माण: समर्थन है। देखें:एनीमेशन से संबंधित गुण。
संस्करण: CSS Grid Layout Module Level 1
जेसक्रिप्ट व्याकरण: object.style.gridAutoFlow="row dense"

ब्राउज़र समर्थन

तालिका में दिए गए नंबरों ने इस गुण को पूरी तरह से समर्थन देने वाले पहले ब्राउज़र का संस्करण को दर्शाया है।

च्रोम IE / एज फ़ायरफॉक्स सफ़ारी ओपेरा
57 16 52 10 44