Bootstrap 4中列之间的垂直空间为空

Question

我有这个html结构：

<div class="container">

   <div class="row">

      <div class="col-lg-9 description"></div>

      <div class="col-lg-3 sidebar"></div>

      <div class="col-lg-9 comments"></div>

   </div>

</div>

最终效果是： 在此处输入图片说明 我需要这个HTML结构，因为当我有一个较小的视口并且Bootstrap切换到1列模式时，我需要侧边栏位于description和comment列之间（实际上是空白）。

问题是，当模板不在“移动模式”下时，我想避免有空白空间。

我尝试了很多方法，但我无法做到这一点，有人可以帮助我吗？

编辑

我这样尝试：

<div class="container">

   <div class="row">

      <div class="col-lg-9">

         <div class="description"></div>

         <div class="comments"></div>

      </div>

      <div class="col-lg-3 sidebar"></div>

   </div>

</div>

并尝试使用css“ order”重新排序，但是没有用（它唯一允许我做的就是将侧边栏放在页面的开头，但这不是我想要的）。