float-none

bootstrap5.css

.float-none {
  float: none !important;
}

html bootstrap5 Sample

インラインでフロートを設定する：float-left

float-left float-right float-none

  <!-- spanだからinlineで、文字数分だけ表示される、それをフロート -->
  <!-- 重ならない、前の要素の後に、順番が適用されていく -->
  <span class="float-left">float-left</span>
  <span class="float-right">float-right</span>
  <span class="float-none">float-none</span>

インライン改行でフロートを設定する：float-left

float-left
float-right
float-none

  <!-- 改行brを入れると、その行でフロートが効く -->
  <span class="float-left">float-left</span><br>
  <span class="float-right">float-right</span><br>
  <span class="float-none">float-none</span>

Float(画像と文字)：float-left

文字が重ならない、画像と同じ位置からスタート

画像の位置から改行されて、文字がスタート

  <div class="clearfix mb-2">
    <div class="float-left"><img src="https://via.placeholder.com/100x100" alt="Image"></div>
    文字が重ならない、画像と同じ位置からスタート
  </div>
  <div class="clearfix mb-2">
    <div class="float-right"><img src="https://via.placeholder.com/100x100" alt="Image"></div>
    文字が重ならない、画像と同じ位置からスタート
  </div>
  <div class="clearfix">
    <div class="float-none"><img src="https://via.placeholder.com/100x100" alt="Image"></div>
    画像の位置から改行されて、文字がスタート
  </div>