Tailwind CSS Float

This class accepts more than one value in tailwind CSS. It is the alternative to the CSS float property. The float class defines the flow of content for controlling the wrapping of content around an element. 

Float Classes

• float-right
• float-left 
• float-none 

float-right Class

This class is used to make the element float on the right side of the container.

Syntax:

<element class="float-right">...</element>

Example:

Output:

float-left Class

This class is used to make the element float on the left side of the container.

Syntax:

<element class="float-left"">...</element>

Example: 

Output:

float-none Class

This class is used to make the element float at the default place. We are using the center tag so the image is placed at the center.

Syntax:

<element class="float-none">...</element>

Example:

Output: