ट्विटर बूटस्ट्रैप नेवबार को केंद्र लिंक में संशोधित करना

ट्विटर बूटस्ट्रैप नेवबार के साथ काम करते समय, उपयोगकर्ताओं को नेविगेशन लिंक को डिफ़ॉल्ट बाएं संरेखण के बजाय केंद्रीय रूप से संरेखित करने की आवश्यकता का सामना करना पड़ सकता है . इसे प्राप्त करने के लिए, सीएसएस स्टाइलशीट का उपयोग करके निम्नलिखित अनुकूलन करें। .नवबार .एनएवी, .navbar .nav > ली { फ्लोट: कोई नहीं; प्रदर्शन: इनलाइन-ब्लॉक; *प्रदर्शन: इनलाइन; /* ie7 ठीक करें*/ *ज़ूम: 1; /* hasLayout ie7 ट्रिगर */ लंबवत-संरेखित करें: शीर्ष; } .नावबार-भीतरी { पाठ-संरेखण: केंद्र; }

वैकल्पिक दृष्टिकोण

बूटस्ट्रैप डिफ़ॉल्ट को संरक्षित करने और एक विशिष्ट नेवबार मेनू को लक्षित करने के लिए, एक कस्टम क्लास बनाएं और इसे नेवबार कंटेनर पर लागू करें:

.navbar .nav,
.navbar .nav > li {
    float: none;
    display: inline-block;
    *display: inline; /* ie7 fix */
    *zoom: 1; /* hasLayout ie7 trigger */
    vertical-align: top;
}

.navbar-inner {
    text-align: center;
}

फिर, सीएसएस स्टाइलशीट में .center वर्ग को लक्षित करें:

    

        ....
    

सबमेनू आइटम को बाईं ओर संरेखित करने के लिए, निम्नलिखित सीएसएस नियम जोड़ें:

.center.navbar .nav,
.center.navbar .nav > li {
    float: none;
    display: inline-block;
    *display: inline; /* ie7 fix */
    *zoom: 1; /* hasLayout ie7 trigger */
    vertical-align: top;
}

.center .navbar-inner {
    text-align: center;
}