Cookie Policy

Our website uses cookies to enhance your browsing experience and provide personalized content. By continuing to use our site, you consent to the use of cookies. You can manage your cookie preferences in your browser settings. For more information, please refer to our Cookie Policy.

Accept all Reject all

Float CSS Property

Posted By: Kanika Gupta Published: 14, Jan 2024

Float CSS Property


Float is yet another important property of CSS used for specifying the position of contents of a webpage. As the name suggests, floating an element means moving an element to the desired position while allowing other elements to wrap around it.

This property is most commonly used to wrap text around images or any inline elements including paragraph, list, button or table.

Values of float property

The most common parameters/values used for this property are

  • Left
  • Right
  • None
  • Initial

Syntax

float: value;

  1. float: left

    2. This property is used to position elements on the left side of the webpage.

    Example:

    Output:

  2. float: right

    3. This property is used to position elements on the left side of the webpage.

    Example:

    Output:


  3. float: none

    4. This property is used to set the floating property of an element to none. The element will not float and will be displayed according to the default value i.e. from left to right.

    Example:


    Output:


  4. float: initial

    5. This property is used to position an element to its initial value.

    Example:

    The element is at first floated to right.


    Output:


    The element is now floated to its initial value – left.


    Output:

    Categories


    Recent Blog