लेआउट ग्रिड कैलकुलेटर (कॉलम, गटर, 8pt ग्रिड)

कुल चौड़ाई, कॉलम की संख्या, गटर और साइड मार्जिन डालें और एक कॉलम तथा लगातार कई कॉलम की चौड़ाई पाएँ। वेब के 12 कॉलम ग्रिड के लिए या प्रिंट पेज को मिलीमीटर में बाँटने के लिए उपयोगी है।

इस्तेमाल का तरीका

1. "इकाई" में px या mm चुनें, फिर "चौड़ाई प्रीसेट" चुनें या "कुल चौड़ाई" टाइप करें।
2. "कॉलम", "गटर" और "मार्जिन" डालें। मार्जिन अलग-अलग हों तो "साइड मार्जिन" को "बाएँ और दाएँ अलग" पर रखें।
3. "कॉलम की चौड़ाई" और "स्पैन चौड़ाई" तालिका देखें, और बैज से जाँचें कि मान "ग्रिड इकाई" में चुने ग्रिड पर है या नहीं। न हो तो नोट में दी गई कुल चौड़ाई आज़माएँ।
4. "तीन ब्रेकपॉइंट की तुलना करें" चालू करके तीन चौड़ाइयाँ एक साथ देखें, और "CSS कॉपी करें" दबाकर कोड लें।

यह कैसे काम करता है

• कॉलम की चौड़ाई = (कुल चौड़ाई − बायाँ मार्जिन − दायाँ मार्जिन − गटर × (कॉलम − 1)) ÷ कॉलम। n कॉलम की चौड़ाई = कॉलम की चौड़ाई × n + गटर × (n − 1)।
• "सामग्री की अधिकतम चौड़ाई" देने पर, कुल चौड़ाई अधिक होने पर सामग्री उसी चौड़ाई पर रहती है और शेष दोनों मार्जिन में बँट जाता है।
• mm मोड में ग्रिड इकाई पॉइंट में है: 1 pt = 0.3528 mm, और 96 dpi पर 1 mm = 3.78 px।
• आपके मान इस डिवाइस के ब्राउज़र में सहेजे रहते हैं।

अक्सर पूछे जाने वाले सवाल

1200 px के 12 कॉलम ग्रिड में कॉलम कितना चौड़ा होता है?

24 px गटर और बिना मार्जिन के, (1200 − 24 × 11) ÷ 12 = 78 px। 32 px गटर पर यह 70.67 px होता है।

कॉलम की चौड़ाई 8 px ग्रिड पर न हो तो क्या करें?

नोट निकटतम गुणज और उसे देने वाली कुल चौड़ाई बताता है: 1224 px सामग्री चौड़ाई पर 78 px का कॉलम 80 px हो जाता है। गटर या मार्जिन में थोड़ा बदलाव भी काम करता है।

A4 पेज में कितने कॉलम होने चाहिए?

कोई एक उत्तर नहीं है। टेक्स्ट के लिए दो या तीन ठीक हैं; फोटो और तालिकाएँ मिलाने में छह या बारह आसान होते हैं। तुलना के लिए A4 210 mm, 15 mm मार्जिन और 4 mm गटर डालें।

कॉपी किए CSS का उपयोग कैसे करें?

.container सामग्री की चौड़ाई और साइड पैडिंग तय करता है; .grid कॉलम और गैप तय करता है। कई कॉलम में फैले तत्व को grid-column: span 4 दें। mm मोड में स्निपेट में प्रिंट के लिए @page मार्जिन भी होते हैं।