Bootstrap 4 で列間の垂直方向のスペースを削除するにはどうすればよいですか?

ブートストラップ 4 での列間の垂直方向のスペースの削除

問題ステートメント:

ブートストラップ 4 2 列レイアウトを使用する場合、ビューポートが「モバイル モード」でない場合、列の間に空の垂直スペースが表示されます。

原因:

ブートストラップ 4フレックスボックスを利用し、すべての列の高さを最も高い列に一致するように調整します。

提案された解決策: Float の使用

空のスペースを避けるには、代わりに float の使用を検討してください。

<div class="container">
  <div class="row d-lg-block">
    <div class="col-lg-9 float-left description">Desc</div>
    <div class="col-lg-3 float-right sidebar">Sidebar</div>
    <div class="col-lg-9 float-left comments">Comments</div>
  </div>
</div>

説明:

• d-lg-block クラスは、行の表示プロパティを大きなビューポート上でブロックするように設定し、列を許可します。 float.

追加の注意事項:

• この場合、列をネストすると (
  )、希望の列順序が得られません。
• 参考として、関連トピック「モバイル バージョンでの順序が異なるブートストラップ」でも同様の問題について説明しています。