jquery - 带水平滚动的 Bootstrap 行

Question

我试图获取包含多列的行(动态的，没有最大值)，因此获得水平滚动。

当我插入一个超过 bootstrap 大小 12 的新列时，它将该列换行。我想要的是将该列保留在同一行中并获得水平 ScrollView 。

已经尝试过类似的东西，但没有成功......

<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>

Answer 1

row-fluid需要样式属性"white-space:nowrap;"，里面的div需要样式属性"display:inline-block;"

.row-fluid{
     white-space: nowrap;
}
.row-fluid .col-lg-3{
     display: inline-block;
}

try it