Bootstrap v4 中的偏移列

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 中的偏移列

Offsetting columns in Bootstrap v4

html

css

twitter-bootstrap-4