Css 桌面模式下响应元件的固定位置

我有一个电子商务一页机，有大约12个项目的引导。在移动模式下，我将签出附加到列表底部。在桌面模式下，我将其拆分为一个单独的列，如下所示。问题是，如果我向下滚动，签出就会消失。我想固定位置，使其与页面一起滚动。我在看Bootstraps和attribue：

<div data-spy="affix" data-offset-top="200">...</div>

。。。

但它似乎不起作用。谁能告诉我，我可以添加到下面的代码，以修复桌面模式的位置

<div class="row" class="visible-desktop">
  <div class="span7" class="visible-desktop">
    <div class="menu-container">
      Column 1
    </div>
  </div>

  <div class="span5" class="visible-desktop">
    <div class="checkout">
      Checkout that breaks out to second column if desktop
    </div>
  </div>
</div>

第1栏
如果是桌面，则跳转到第二列的签出

我会这样做，为桌面添加一个媒体查询。 如果使用引导，桌面模式高于979px

@media (min-width:979px) {
  .checkout {
    position:fixed;
    bottom:0; 
    right:0; 
    z-index:100;

  }
}

当然，改变尺寸和位置，以满足您的需要

---

这是尺寸参考页，bootstrap 2.3.2文档

如果您使用的是最新版本的bootstrap.visible desktop类更改为.visible md.visible lg，请查看我应该提到我使用的是bootstrap 2.3.2