CSS
Float

Float is used to align an element to the left or right side of its container.

It is similar to text-align but the main difference between them is that Align does not remove the item from the document flow whereas float removes it.

Property Values

The possible values are as follows:

Values	Description
right	It aligns the element along the right side.
left	Default value. It aligns the element along the left side.
inherit	It inherits the alignment of the parent.

Float Example

Below example will demonstrate the basic architecture of CSS Float

Float text to right

Copy Code


p {
  float: right;
}

Float text to left

Copy Code


p {
  float: left;
}

Float text as inherit

Copy Code


p{
  float: inherit;
}

Example:

Copy Code


<!doctype html>  
<html>
    <head>
        <title>...</title>
    </head>
  
    <body>
       <p style="float: right;">Learn CSS from PHPDocs.</p>
    </body>
</html>