Twitter bootstrap 引导中的滚动条

我试图在引导网格系统中创建一个可滚动的div。但它不起作用。没有引导，我可以得到滚动条。这是我的小提琴。在bootstrap内我没有滚动条，但在bootstrap网格外我有滚动条。我试图在不固定外部div高度的情况下实现滚动条。我不能使用最大高度，因为它在一定高度后不会增加

更新

在这次更新中，我添加了一个小jQuery，我将屏幕的高度分配给内容，这样您也将获得与height=100%相同的效果

可能对您有所帮助的其他信息：

在这行中：您可以根据引导的网格系统更改div的宽度。该分区上有4个类

col-lg-12当屏幕宽度大于1200px时，可识别此类。你可以相应地更改号码。12是电网系统的全尺寸，6是电网系统全尺寸的一半，4是电网系统全尺寸的3/4，等等。 当屏幕宽度等于或大于768px时，识别col-sm-12。同样的规则也适用于数字。 当屏幕宽度大于992px时，可识别col-md-12。数字也是这样。 col-xs-12 si识别屏幕宽度是否小于768px，从而识别移动设备。此处的所有网格编号都相当于网格系统的完整大小。例如，如果使用col-xs-12，宽度将与使用col-xs-1时100%相同，对于2、3、4等，宽度也将100%相同。

---

嗨，我不想固定容器的高度。在更大的屏幕分辨率，它将有固定的高度，我不希望。我希望它占据整个可用的视口。事实上，据我所知，如果将宽度设置为100%，则无法实现滚动，因为无论放置多少内容，它都只会推动div的底部。您应该使用jQuery为div分配高度。请参阅更新我的答案。css上的高度属性将被jQuery高度覆盖。是的，如果您查看下面的示例，我同意高度设置为100%，但仍然可以滚动。同样，如果我把它放在引导列中，它就不起作用了。那里现在，它位于引导列中，卷轴可以工作。这和我对我的答案所做的一样，但我会再次解释，这样你就会明白了。如果它在bootstrap列中，而没有我添加的jQuery，它将无法工作。

    <div class="container">
  <div class="row">
      <div class="col-sm-9">
          <div id="container">

    <div id="fixeddiv-top">FIXED DIV (TOP)</div>
    <div id="content-container">
        <div id="content">CONTENT<br>CONTENT<br>CONTENT<br>CONTENT<br>CONTENT<br>CONTENT<br>CONTENT<br>CONTENT<br>CONTENT<br>CONTENT<br>CONTENT<br>CONTENT<br>CONTENT<br>CONTENT<br>CONTENT<br>CONTENT<br>CONTENT<br>CONTENT<br>CONTENT<br>CONTENT<br>CONTENT<br>CONTENT<br>CONTENT<br>CONTENT<br>CONTENT<br>CONTENT<br>CONTENT<br>CONTENT<br>CONTENT<br>CONTENT<br>CONTENT<br>CONTENT</div>
    </div>
    <div id="fixeddiv-bottom">FIXED DIV (BOTTOM)</div>
</div>
</div>
</div>



      </div>
      <div >

      </div>
    </div>
</div>    
            <br/><br/>
Without bootstrap Grid scroll works!!

             <div id="container">

    <div id="fixeddiv-top">FIXED DIV (TOP)</div>
    <div id="content-container">
        <div id="content">CONTENT<br>CONTENT<br>CONTENT<br>CONTENT<br>CONTENT<br>CONTENT<br>CONTENT<br>CONTENT<br>CONTENT<br>CONTENT<br>CONTENT<br>CONTENT<br>CONTENT<br>CONTENT<br>CONTENT<br>CONTENT<br>CONTENT<br>CONTENT<br>CONTENT<br>CONTENT<br>CONTENT<br>CONTENT<br>CONTENT<br>CONTENT<br>CONTENT<br>CONTENT<br>CONTENT<br>CONTENT<br>CONTENT<br>CONTENT<br>CONTENT<br>CONTENT</div>
    </div>
    <div id="fixeddiv-bottom">FIXED DIV (BOTTOM)</div>
</div>