<div class="container my-4">

​

    <p class="font-weight-bold">Toggle floats on any element, across any breakpoint, using bootstrap responsive float

      utilities.</p>

​

    <p><strong>Detailed documentation and more examples you can find in our <a

          href="https://mdbootstrap.com/docs/jquery/utilities/float/" target="_blank">Bootstrap Float Docs</a> </p>

​

    <hr>

​

    <p class="font-weight-bold">Basic example</p>

​

    <p>Add <code>.float-right</code> class to aling item to the right side</p>

​

    <div class="border border-light p-5 mb-4">

​

      <div class="float-right">Float right on all viewport sizes</div>

​

      <br>

​

    </div>

​

    <hr>

​

    <p class="font-weight-bold">More examples</p>

​

    <div class="border border-light p-5 mb-4">

​

      <div class="float-left">Float left on all viewport sizes</div>

      <br>

      <div class="float-right">Float right on all viewport sizes</div>

      <br>

      <div class="float-none">Don't float on all viewport sizes</div>

​

    </div>

​

  </div>