Float

Toggle floats on any element, across any breakpoint, using our responsive float utilities.

Overview

These utility classes float an element to the left or right, or disable floating. Responsive variants (.float-sm-start, .float-md-end, etc.) are also available.

<div class="clearfix">
  <div class="float-start">Float start</div>
  <div class="float-end">Float end</div>
</div>

Responsive

Float utilities are fully responsive:

<div class="float-sm-start">Float start at sm+</div>
<div class="float-md-end">Float end at md+</div>
<div class="float-lg-none">No float at lg+</div>