Tailwind CSS Float

Tailwind CSS Float

Tailwind CSS float utility classes are used to control the wrapping element alignment. It is basically just like CSS float property.

There are followings float classes:.float-right, .float-left, .float-none.

Float: float-right

The .float-right class is used to place the element right side of the container.

General Syntax

Try it now

Source Code

Try it now

Source Code : Output

image

Lorem ipsum, dolor sit, amet consectetur adipisicing elit. Vel quos corporis nemo est?

Float: float-left

The .float-left class is used to place the element on the left side of the container.

General Syntax

Try it now

Source Code

Try it now

Source Code : Output

image

Lorem ipsum, dolor sit, amet consectetur adipisicing elit. Vel quos corporis nemo est?

Float: disabled

To reset any applied float, use the .float-none class.

General Syntax

Try it now

Source Code

Try it now

Source Code : Output

float none applied on this image

Maybe we can live without libraries, people like you and me.