बिना C वाला CSS: Grid से लेआउट

हर बेहतरीन पोर्टफोलियो को अपना काम दिखाने का एक साफ़-सुथरा तरीका चाहिए। इसका क्लासिक पैटर्न है प्रोजेक्ट कार्ड्स का ग्रिड — करीने से लगी पंक्तियां और कॉलम जो स्क्रीन का आकार बदलने पर अपने आप फिर से जम जाते हैं।

पुराने तरीके में floats और clearfix से जूझना पड़ता था। नया तरीका? आप बस बताते हैं कि आपको क्या चाहिए — "तीन बराबर कॉलम, बीच में gap के साथ" — और Tailwind की grid utilities बाकी सब संभाल लेती हैं। किसी CSS फ़ाइल की ज़रूरत नहीं।

इस पाठ में आप एक रेस्पॉन्सिव प्रोजेक्ट ग्रिड बनाएंगे: एक heading, फिर तीन कार्ड्स वाला एक grid कंटेनर। पाठ के अंत तक आप grid, grid-cols-3 और gap समझ जाएंगे — वे तीन टूल जिन्हें आप बार-बार इस्तेमाल करेंगे।