如何在引导4中消除响应模式下的偏移量

Question

我有一个非常简单的设置，看起来如下：

<div class="row">
        <div id="whoarewe" class="offset-2 col-lg-4 col-md-4 col-xs-12 col-sm-12"></div>
        <div id="whatwedo" class="col-lg-4 col-md-4 cold-sm-12 col-xs12>
        </div>
 </div>

问题是，在响应模式下，id #whoarewe仍然有2列偏移量，因此不与#whatwedo垂直排列。我是否可以通过简单的media query来完成这个任务呢？或者，在col和col中是否有一个引导属性来处理它？

我试图设置col-lg-offset-2和col-sm-offset-0，但这没有起作用：

谢谢。

Answer 1

我想出了一个在我的例子中有效的解决方案，基本上使用了一个名为row的justify-content-around属性，如下所示：

<div class="row justify-content-around">
    <div class="col-lg-4"></div>
    <div class="col-log-4></div>
</div>

Answer 2

<div class="row">
    <div id="whoarewe" class="col-md-4 offset-md-2"></div>
    <div id="whatwedo" class="col-md-4"></div>
</div>

参考文档获得正确的偏移量类：https://getbootstrap.com/docs/4.0/layout/grid/#offsetting-columns

否则，您可以根据需要设置列宽，并根据需要对内容进行调整，从而实现一些灵活的魔术。

https://getbootstrap.com/docs/4.0/utilities/flex/#justify-content