CSS Float

The Float property in CSS is used to float the elements on the page. Imagine all the elements on the page as floating elements that by default float to the left. This property comes in to specify the position of an element on the web page.

The property's syntax and values:

float: right | left | none | inherit;

The Text properties in action:

   
    
    <style>
      .div{
        height: 20px;
        width: 200px;
        background-color: Tomato;
      }
      .p1 {float: left;}
      .p2 {float: right;}

    </style>

      <div class="p1 div">Float to the left.</div>

      <div class="p2 div">Float to the right.</div>

The output:

Float to the left.

Float to the right.