कॉलम-चौड़ाई - सीएसएस-ट्रिक्स

Anonim

जब आप अपने कॉलम को एक विशिष्ट चौड़ाई पर रखना चाहते हैं, तो उपयोग करें column-width

section ( -webkit-column-width: 200px; -moz-column-width: 200px; column-width: 200px; )

ब्राउज़र गणना करेगा कि अंतरिक्ष में कम से कम कितनी चौड़ाई के कॉलम फिट हो सकते हैं। column-widthब्राउज़र के लिए न्यूनतम चौड़ाई के सुझाव के रूप में सोचें ।

column-widthएक लचीली संपत्ति है। एक बार जब ब्राउज़र आपके निर्दिष्ट चौड़ाई पर कम से कम 2 कॉलम फिट नहीं कर सकता है तो कॉलम एक कॉलम में बंद हो जाएगा और छोड़ देगा।

इस संपत्ति का उपयोग शॉर्टहैंड के लिए भी किया जाता है columnsऔर इसके साथ मिलकर काम में लिया जा सकता है column-count। जब दोनों संपत्तियों को घोषित किया column-countजाता है तो अधिकतम संख्या में कॉलम होते हैं।

मूल्यों

आप सेट कर सकते हैं column-widthकरने के लिए autoया लंबाई।

उपयोग करें autoयदि आप भी उपयोग कर रहे हैं column-countया यदि आपको संपत्ति बंद करने की आवश्यकता है। इसे ब्राउज़र को column-countलेड बताने का एक तरीका के रूप में सोचें ।

स्तंभों की चौड़ाई निर्दिष्ट करने के लिए, 0. से अधिक (या इसके बराबर) की लंबाई का उपयोग करें। आप प्रतिशत को छोड़कर किसी भी CSS इकाई का उपयोग कर सकते हैं।

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

बहु-स्तंभ लेआउट समर्थन:

क्रोम सफारी फ़ायर्फ़ॉक्स ओपेरा अर्थात एंड्रॉयड आईओएस
कोई 3+ 1.5+ है 11.1+ 10+ 2.3+ 6.1+ है

अपने उपसर्गों को मत भूलना!