बूटस्ट्रैप की स्टैक्ड पंक्तियों में अंतराल को हल करना

पोर्टफोलियो पेज के लिए बूटस्ट्रैप ग्रिड का निर्माण करते समय, आपको एक समस्या का सामना करना पड़ सकता है जहां स्टैकिंग करते समय लंबी टाइलें लेआउट में गैप का कारण बनती हैं घटित होना। ग्रिड के भीतर तत्वों की अलग-अलग ऊंचाई के कारण यह समस्या उत्पन्न होती है। इसे हल करने के लिए, कई समाधान मौजूद हैं:

1. सभी पोर्टफोलियो तत्वों के लिए एक ऊंचाई निर्धारित करें: प्रत्येक पोर्टफोलियो तत्व के लिए एक निश्चित ऊंचाई स्थापित करने से अंतराल को खत्म करते हुए लगातार स्टैकिंग सुनिश्चित होती है।
2. गतिशील फिटिंग के लिए चिनाई का उपयोग करें: चिनाई एक लेआउट उपकरण है जो उपलब्ध स्थान में फिट होने के लिए तत्वों को गतिशील रूप से व्यवस्थित करता है, अलग-अलग सामग्री की लंबाई के साथ भी अंतराल। विभिन्न ब्रेकप्वाइंट पर समस्याएं।
3. कॉलम ऊंचाई समायोजित करने के लिए jQuery का उपयोग करें गतिशील रूप से: jQuery का उपयोग स्तंभों की ऊंचाई को गतिशील रूप से समायोजित करने के लिए किया जा सकता है, यह सुनिश्चित करते हुए कि वे सामग्री की लंबाई की परवाह किए बिना ठीक से संरेखित हों।
4. समस्या को हल करने के लिए यहां एक विशिष्ट तकनीक है:

    

        ...
    
    

@media (अधिकतम-चौड़ाई: 767px) { .पोर्टफोलियो>.क्लियर:एनथ-चाइल्ड(6एन)::पहले { स्पष्ट: दोनों; } }यह दृष्टिकोण प्रदान करता है:

    

        ...
    
    

पढ़ने योग्य और रखरखाव योग्य मार्कअप:

• विभिन्न स्क्रीन आकारों में संरेखण: सीएसएस यह सुनिश्चित करता है कि तत्व सभी सामान्य ब्रेकप्वाइंट पर संरेखित हैं, जिससे अंतराल.