Css BS4-向右浮动第1列

我使用的是bootstrap4，在中型设备中，我需要将第一个div列向右浮动，而在移动设备上，它首先显示。在bootstrap3中有可能使用下面这样的结构，但由于bs4现在使用flex，它似乎不起作用。你知道如何做到这一点吗

<div class="row">
    <div class="col-12 col-md-8 float-right">
         //RIGHT BANNER HERE
    </div>
    <div class="col-12 col-md-4">
        //SOME CONTENTS
    </div>
</div>

//右横幅在这里
//一些内容

您不需要额外的CSS。

在引导程序4中，

行

是

display:flex

，因此您可以使用

d-md-block

（

display:block

在md及以上）覆盖

行

中的

display:flex

<div class="row d-md-block">
    <div class="col-12 col-md-8 float-right">
         //RIGHT BANNER HERE
    </div>
    <div class="col-12 col-md-4">
        //SOME CONTENTS
    </div>
</div>

//右横幅在这里
//一些内容

---

行

带有
显示：flex覆盖它们！重要信息
取消此效果


.row{display:block！important；}

//右横幅在这里
//一些内容
示例中的HTML结构似乎很奇怪，您在两个容器中都使用了col-12。我假设你希望横幅在右边，而不是四处飘荡，只是为了在那里，为什么不只是改变一下你的HTML

差不多


html{
填充：20px；
}
.banner，.main{
边框：实心1px灰色；
}

//一些内容
//右横幅在这里
行上的两个div都是col-12，您确定这是您想要的吗？为什么要添加额外的CSS<代码>d-md-block

是

显示：block

。使用！直接重要不是一个明智的选择，我支持@Themes.guide。嗨，我得投反对票。该结构被认为是响应“移动优先”。我需要的是，当右_横幅位于从xs到sm的视口中时，右_横幅将占据全部12列，并位于主_内容上方。因此，有必要在col-12的主要内容上方声明。同样的情况也发生在col-12的主屏幕上，位于右屏幕下方@zim的答案应该是实现这一点。我建议您在问题中澄清这类事情，因为您在这里提到的内容都不在原始问题中。在更新之前对问题进行向下投票。