tutorialstonight logo
A Platform To Learn To Code

CSS FLOAT



CSS float property floats the element left or right of its container. CSS float property defines flow of content. Once float value is defined element is removed from normal flow of webpage and behaves like defined.

It is used to push HTML elements or containers left or right.

CSS Float properties

Value Description
left It pushes element to left.
right It pushes element to right.
inherit It inherit float value from parent element.
none It is default value of float.It specifies that element is not floated.


CSS float left

The element having property float:left; is pushed left to the webpage.

Example

Run the code

Output:

Floating Left




CSS float right

The element having property float:right; is pushed right to the webpage.

Example

Run the code

Output:

Floating Right




CSS clear property

CSS clear property is used to control the element which will float beside that element.

If we specify value clear: left; then no floating element will be allowed to the left side of the element.

Example

Run the code

Output:

Floating left
This div element does not allow any element to float its left side.



BOX

BOX