Bootstrap fixed col-md-4

Question

我想将引导列位置设置为固定的（col-md-4）。 这是关于一个店铺，分为2列：

1. 店含量（很长&滚动）col-md-8
2. 车的内容（很短&固定的，所以当你滚动商店的内容，在购物车的内容始终保持可见）col-md-4

我不知道在bootstrap中这样做的正确方法是什么。

这是我预期的行为：http://image.noelshack.com/fichiers/2016/08/1456677164-neededbehavior.jpg

现在，我已经尝试设置col-md-4位置固定css财产，它有点儿工作，但不是全部。

正如您在this picture中所看到的，当我将col-md-4的位置设置为固定时，其宽度（col-md-4的33％）比应该更宽。

实际上，col-md-4的bootstrap的css属性宽度为33％，它是从其父容器中计算出来的。

但是，当位置设置为固定时，由于某些原因，33％是从屏幕视图宽度计算的。因此，如果分辨率宽度为2500像素，则不会是容器1170像素的33％，而是2500像素的屏幕尺寸的33％。 因此，col-md-4是比预期更宽，并溢出容器。

我想我可以重新计算在JavaScript中的正确宽度，但我不知道是否有一个正确的方法来做bootstrap（我猜是这样）。

Answer 1

在这种特殊情况下，我不会使用Bootstrap col类。它会更好看的东西，如：

<div class="content"></div> 
<div class="cart"></div> 

.content { 
    width: 100%; 
    padding-right: 200px; 
} 

.cart { 
    width: 200px; 
    position: fixed; 
    top: 0; 
    right: 0; 
    z-index: 99; 
} 

引导是好的，但不要忘了，那山坳类是浮动的项目。在你的情况下，这种方法并不合适，因为你希望你的.cart侧栏被修复，并且不遵守任何浮动规则。