Question

过去是什么：

<div class="row">
  <div class="col-sm-2 col-sm-offset-3"> ... </div>
</div>

变成了：

<div class="row">
  <div class="col-xs-2 offset-xs-3"> ... </div>
</div>

在Bootstrap v4 Alpha中。现在，我已将网站更新为v4 Beta offset-xs-3似乎不再有效：https://getbootstrap.com/docs/4.0/layout/grid/#offsetting-columns。

如何在v4 Beta中按指定数量的列进行偏移？

https://codepen.io/Deka87/pen/prVLyE

Answer 1

这是你需要的，https://jsfiddle.net/5L49z51y/1/？

<div class="row">
  <div class="col-sm-2 ml-sm-auto mr-sm-auto"> Here </div>
</div>

Answer 2

我知道这不是很漂亮，但是由于Bootstrap v4-beta取消了游戏中的数字偏移量，你可以先添加一个空列，然后使它想要偏移下一个列。

[class*="col-"] {
  background-color: #eee;
}
.row {
  background-color: #f9f9f9;
}

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/css/bootstrap.min.css" rel="stylesheet"/>

<div class="container-fluid">
  <div class="row">
    <div class="col-sm-3"></div>
    <div class="col-sm-2">
      .col-sm-2 offseted by 3 columns
    </div>
  </div>
</div>

在Bootstrap v4中偏移列

2 个答案: