<aside> 👉 The float property should not be used for layout purposes.

Its original purpose is to have elements floating around others, such as text around an image. With the introduction of flex and grid, float is no longer necessary for layout.

</aside>

The CSS float property positions an element to the left or right of its container allowing for multi-column layouts and positioning elements around other elements.

To use the float property, add the following code to your CSS file:

.element {
  float: left;
}

The value 'right' can also be used to float an element to the right.

However, floating elements can cause layout issues & text wrapping. To prevent this, the CSS clear property is recommended:

.clear {
  clear: both;
}