Html 使用带固定位置div的引导网格

我尝试使用引导网格布局，但也使用一个垂直固定的div，当您向下滚动页面时。为了修复div，我使用了“position:fixed”，但这似乎打破了包含的类。文本溢出到下一列，这是不应该的

    <div class="container">
    <div class="row-fluid">
        <div class="col-md-1">
            <div>
                Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque blandit euismod dolor id posuere. In vulputate lacinia sem vel dignissim. Donec eu ornare lacus. Vestibulum quis enim et mauris mattis commodo blandit eget lectus. Sed sem augue, aliquet ac vulputate in, congue suscipit justo. Duis ac rhoncus tellus. Sed eu faucibus leo. Mauris imperdiet nisi vitae nisi varius, a egestas purus laoreet. Suspendisse eu sodales mi. Nunc in laoreet ipsum, id mattis massa. Sed in iaculis augue, vel commodo turpis. Aliquam placerat velit in justo vulputate, eu pulvinar nunc facilisis. Maecenas sit amet purus est. Integer in pharetra tortor. Donec ac lorem massa. Fusce ac eros pharetra, blandit tellus at, varius velit. 
            </div>
        </div>
        <div class="col-md-5">
            <div>
                Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque blandit euismod dolor id posuere. 
            </div>
        </div>

        <div class="col-md-3">
            <div style="position:fixed">
                <b>This should remain fixed as I scroll down the page</b> 
            </div>
        </div>

        <div class="col-md-3">
            <div>
                Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque blandit euismod dolor id posuere. 
            </div>
        </div>
    </div>
</div>

Lorem ipsum dolor sit amet，是一位杰出的献身者。奎斯克·布兰迪特·尤伊斯莫德·多洛尔·波苏尔。在瓦努特拉齐尼亚，他是一个高贵的人。不，你是奥纳雷·拉库斯。前庭是一个美丽的前庭。我是奥古斯，阿利奎特·阿卡普特，康格·苏西皮特·胡斯托。杜伊斯是一只大菱鲆。塞德·欧·福西布斯·利奥。Mauris vitae nisi varius，一种老芦苇。Suspendisse eu sodales mi。拉奥里特·伊普苏姆的努克，我是马蒂斯·马萨。在iaculis-augue，vel-Comodo turpis。在欧盟pulvinar nunc设施的justo vulputate中的Aliquam placerat velit。梅塞纳坐在埃米特-普鲁斯东边。pharetra tortor中的整数。Donec ac lorem massa。法雷特拉、布朗迪特·泰勒斯、维利特葡萄。
Lorem ipsum dolor sit amet，是一位杰出的献身者。奎斯克·布兰迪特·尤伊斯莫德·多洛尔·波苏尔。
当我向下滚动页面时，这应该保持不变
Lorem ipsum dolor sit amet，是一位杰出的献身者。奎斯克·布兰迪特·尤伊斯莫德·多洛尔·波苏尔。

---

我应该怎么做才能在滚动时保持div的固定，同时遵守引导设置的网格布局

我解决这个问题的方法是让jQuery在页面加载时获取div的大小，然后将其传递给内部div的css。像这样：

var divWidth = $( '.yourDiv' ).width();

这将在页面加载后立即获取宽度

function keepDivWidth() {
  $( window ).scroll( function () {
    var top = $( window ).scrollTop();
    if ( top >= 10 ) ) {
      $( '.yourDiv' ).addClass( 'fixed' );
      $( '.yourDiv' ).css({
         "width" : divWidth
         })
    }else{
      $( '.yourDiv' ).removeClass( 'fixed' );
      $( '.yourDiv' ).css({
        "width" : ""
      })
    }
  })
}(jQuery);

if（top>=10）

部分可以是您想要的任何内容。“10”只是一个填充词 然后，它就像在网页中调用新函数一样简单

$(document).ready(function(){
    keepDivWidth();
});

---

或者，我想你可以把你需要的东西用row类封装在一个div中。不过我还没有测试过

可以帮助你吗？看到这个答案了吗：所以我必须让那个div完全独立，在引导网格之外？有没有办法让它在调整大小时可以折叠，就像col-md-3那样？