बूटस्ट्रैप नेवबार के अंदर कंटेनर के डिफ़ॉल्ट व्यवहार को बदलने का तरीका जानने की कोशिश कर रहा है। डिफ़ॉल्ट रूप से यह नेवबार रैपर में केंद्र को लंबवत रूप से संरेखित करता है (नीचे छवि देखें), लेकिन मैं इसे शीर्ष पर गठबंधन करना चाहता हूं।

Default behiavior

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

.navbar और .container कक्षाओं में लंबवत-संरेखण संपत्ति जोड़ने का प्रयास किया लेकिन यह कुछ भी नहीं बदला। शायद यह एक फ्लेक्स सेटिंग है?

0
Casey 26 अक्टूबर 2018, 03:16

1 उत्तर

सबसे बढ़िया उत्तर

आप align-items:center; को .navbar से align-items: flex-start; में बदल सकते हैं, या आप नेवबार पर बूटस्ट्रैप उपयोगिता वर्ग .align-items-start जोड़ सकते हैं।

<nav class="navbar navbar-expand-lg navbar-light bg-light align-items-start">
    ...
</nav>

आप यहां फ्लेक्सबॉक्स के बारे में अधिक पढ़ सकते हैं: https://css-tricks .com/snippets/css/a-guide-to-flexbox/

1
David Liang 26 अक्टूबर 2018, 07:55