jQuery 带水平滚动的 Bootstrap 行
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/26281242/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Bootstrap row with horizontal scroll
提问by Nacho
Im trying to get a row with multiple columns (dynamic with no max) and therefore to get an horizontal scroll.
我试图获得具有多列的行（没有最大值的动态），因此获得水平滚动。
When i insert a new column that exceeds the size 12 of bootstrap, it takes that column to a new line. What I want is to preserve that column in the same line and to get the horizontal scroll view.
当我插入一个超过 bootstrap 大小 12 的新列时，它将将该列移到新行。我想要的是将该列保留在同一行中并获得水平滚动视图。
Tried already with something like this, but didn't worked...
已经尝试过这样的事情，但没有奏效......
<div class="span11" style="overflow: auto">
<div class="row-fluid">
<div class="col-lg-3">COL1</div>
<div class="col-lg-3">COL1</div>
<div class="col-lg-3">COL1</div>
<div class="col-lg-3">COL1</div>
<div class="col-lg-3">COL1</div>
<div class="col-lg-3">COL1</div>
<div class="col-lg-3">COL1</div>
</div>
</div>
回答by Erfan
row-fluid need the style attribute " white-space: nowrap; " and the divs inside need the style attribute " display: inline-block; "
row-fluid 需要样式属性“ white-space: nowrap; ”，里面的 div 需要样式属性“ display: inline-block; ”
.row-fluid{
white-space: nowrap;
}
.row-fluid .col-lg-3{
display: inline-block;
}
回答by FaizFizy
Larger screen will also need float: none;in col-classes.
较大的屏幕也需要float: none;在col-课程。
.row-fluid {
overflow: auto;
white-space: nowrap;
}
.row-fluid .col-lg-3 {
display: inline-block;
float: none;
}
