偏移列不起作用(Bootstrap v4.0.0-beta)

Question

我正在使用Boostrap 4(Bootstrap v4.0.0-beta)Beta并面临偏移列的问题.早些时候我曾经做过偏移-md-*并且它正在工作,BS4 Beta根据文档将其删除.docs中提到的新方法是使用.ml-auto,当我尝试将它与col-md-4一起使用时,它会偏移4列.我想要的是自定义偏移

**<div class="col-md-4 offset-md-2"></div>**

我试过用

**<div class="col-md-4 ml-md-2"></div>**

但没有工作这是错误还是有另一种方法可以做到这一点？

这是关于抵消https://getbootstrap.com/docs/4.0/layout/grid/#offsetting-columns的官方文档

Answer 1

Bootstrap 4 offset类在Beta 1中被临时删除,但在Beta 2中被恢复.

班级名称col-{breakpoint}-offset-*被替换为offset-{breakpoint}-*

新的自动边距也适用于偏移列,将尽可能地移动列.因此,这取决于您希望将列"推"到右侧的程度.如果它们的右边没有其他列,那么col-md-4它将会一直向右移动row.基本上offset与浮动列相关,但现在不再相关Bootstrap 4是flexbox.

如果你想只移动col-md-42列单位,最好的方法是使用虚拟/占位符列 ......

<div class="row">
      <div class="col-md-2"></div>
      <div class="col-md-4">
            ..
      </div>
</div>

https://www.codeply.com/go/SqrQIOAY7

如果有其他col-md-4的第一权,然后ml-auto和mr-auto将努力中心两列 ...

<div class="row">
        <div class="col-md-4 ml-auto">
            .
        </div>
        <div class="col-md-4 mr-auto">
            .
        </div>
</div>

https://www.codeply.com/go/SqrQIOAY7n

如果要居中col-md-4,然后简单地使用mx-auto,以创造两岸平等的利润率.

注意:从Beta 2开始,将恢复特定的列偏移