bootstrap4.css
.float-right {
  float: right !important;
}
■フロート:Float:ユーティリティ:フロートを設定するクラス

float-left
float-right
float-none
  <span class="float-left">float-left</span><br>
  <span class="float-right">float-right</span><br>
  <span class="float-none">float-none</span>
■親要素でフロートを解除する:Clearfix:ユーティリティ:親要素で設定して、フロートを解除するためのクラス(重なっていない浮いているから背景色出る)

右フロート
  <div class="w-50 mx-auto bg-danger clearfix">
    <div class="float-right bg-success">右フロート</div>
  </div>
■親要素でフロートを解除する:Clearfix:ユーティリティ:フロートを解除しない(重なっているので背景色がでない)

右フロート
  <div class="w-50 mx-auto bg-danger">
    <div class="float-right bg-success">右フロート</div>
  </div>
■親要素でフロートを解除する:Clearfix:ユーティリティ:Floatクラス float-left float-right clearfixはあってもなくても同じみたい

左寄せ画像 右寄せ画像
  <div class="clearfix">
    <img src="https://via.placeholder.com/200x200" class="float-left" alt="左寄せ画像">
    <img src="https://via.placeholder.com/200x200" class="float-right" alt="右寄せ画像">
  </div>