ट्विटर बूटस्ट्रैप चिपका साइडबार गिर जब मैं

Question

मैं ट्विटर बूटस्ट्रैप डॉक्स में लोगों की तरह एक साइडबार बनाने के लिए कोशिश कर रहा हूँ नीचे स्क्रॉल: http://twitter.github.com/bootstrap/getting-started.html

मैं प्रत्यय काम कर मिल गया है और सभी लेकिन आप डेटा- पीछे स्क्रॉल जब भी बार ऑफसेट बंद हो जाता है क्योंकि इसमें कोई नहीं है।

एचटीएमएल

<div class="span3"> 
      <ul data-spy="affix" data-offset-top="255" class="nav nav-tabs nav-stacked docs-sidebar" id="navbar"> 
      <li><a href="#grid">Grid system <i class="icon-chevron-right pull-right"></i></a></li> 
      <li><a href="#fluidGridSystem">Fluid grid system <i class="icon-chevron-right pull-right"></i></a></li> 
      <li><a href="#layouts">Layouts <i class="icon-chevron-right pull-right"></i></a></li> 
      <li><a href="#responsive">Responsive design <i class="icon-chevron-right pull-right"></i></a></li> 
      </ul> 
      <p></p> 
     </div> 

कम

// For Affix plugin 
.affix { 
    position: fixed; 
    top: (@navbarHeight * 1.8) + @navbarPadding + 25px; 
} 

.docs-sidebar { 
    width: (@gridColumnWidth * 4); 
} 

यह साइडबार एक निश्चित span4 चौड़ाई बनाता है, लेकिन यह उत्तरदायी नहीं है। मैं कैसे सुनिश्चित कर सकता हूं कि यह उत्तरदायी है?

Answer 1

मैं भी ऐसा करने का सबसे अच्छा तरीका जानने की कोशिश कर रहा हूं। मैंने जो किया है वह यहां है। शायद सबसे अच्छा समाधान नहीं है लेकिन यह काम कर रहा है।

मेरे पास दो कॉलम लेआउट हैं जहां मैं बाएं से .affix चाहता हूं। मैंने पंक्ति से बाहर निकलने के लिए कॉलम खींचा और इसे मूल से ऊपर अपनी पंक्ति में रखा। मैंने .offset3 जोड़कर शेष कॉलम को स्थानांतरित कर दिया। मैंने उल के बजाए कॉलम div पर .affix डाल दिया। फिर मैंने स्थिति के सीएसएस के साथ एक div में निश्चित कॉलम लपेट लिया: पूर्ण; (वह .row div के अंदर और .col3 div के बाहर है) जो दो .row divs को ओवरलैप करने के लिए रखता है जहां कोई तय होता है और दूसरा स्क्रॉलिंग होता है।