如何重叠Bootstrap 3中的列？

Question

我想用两个重叠的列创建单行:

.row
  .col-sm-7
  .col-sm-6

以便网格的第6列重叠.

部分可能的是.col-sm-pull-1:

.row
  .col-sm-6
  .col-sm-6.col-sm-pull-1

但是第12列变空了.我试过了:

.row
  .col-sm-6
  .col-sm-7.col-sm-pull-1

但第二列移动到下一行.

我找到了Bootstrap 2的答案(如何使用twitter bootstrap重叠列？).Bootstrap 3有可能吗？

Answer 1

看到你的图片示例后,我想也许这就是你要找的东西.(我让它们重叠2列,因为这会使它更好地居中)

.blue{
    background-color: rgba(0,0,255,0.5);;
}
.row .red{
    background-color: rgba(255,0,0,0.5);
    position: absolute;
}
.red, .blue {
    height: 70px;
}

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet"/>
<div class="container">
    <div class="row">
        <div class="red col-xs-7"></div>
        <div class="blue col-xs-7 col-xs-push-5"></div>
    </div>
</div>