BOOTSTRAP FLOAT

 Use Bootstrap float utilities to toggle the element to left or right, or disable floating. To toggle an element to the right with .float-end class and left with .float-start class.

Example

All viewport sizes,

• .float-start (Float content to left)
• .float-end (Float content to right)
• .float-none (Don't float content)

Note: Float utilities do not work on flex items

Responsive Float Start

Float an element to the left depending on your screen size with the responsive float start classes.

• .float-sm-start - Float content to the left on small screens (SM) or wider 
• .float-md-start - Float content to the left on medium screens (MD) or wider
• .float-lg-start - Float content to the left on large screens (LG) or wider
• .float-xl-start - Float content to the left on extra-large screens (XL) or wider
• .float-xxl-start - Float content to the left on XXL screens or wider

Responsive Float End

Float an element to the right depending on your screen size with the responsive float end classes.

• .float-sm-end - Float content to the right on small screens (SM) or wider 
• .float-md-end - Float content to the right on medium screens (MD) or wider
• .float-lg-end - Float content to the right on large screens (LG) or wider
• .float-xl-end - Float content to the right on extra-large screens (XL) or wider
• .float-xxl-end - Float content to the right on XXL screens or wider

Responsive float-none classes are,

• .float-sm-none
• .float-md-none
• .float-lg-none
• .float-xl-none
• .float-xxl-none