CSS Clear

CSS Tutorial  >  Clear

The clear property is used to cancel the effect of float. Possible values for the clear property are:

  • left: Keep the left side clear.
  • right: Keep the right side clear.
  • both: Keep both sides clear.
  • none: Do not keep either side clear.

    Let's take a look at a modified example from the float page:

    CSS declaration:

    #leftfloat {
      float:left;
    }

    #clearleft {
      clear:left;
    }

    the following HTML,

    <span id="leftfloat"><img src="yp.jpg"></span>This example <span id="clearleft"> illustrates how clear:left breaks the float property. </span>

    renders,

    This example illustrates how clear:left breaks the float property.

    Notice that once the clear:left style is applied, the float:left style no longer applies, and all the text following the clear:left style appear below the image.

    Next: CSS Cursor



    Copyright © 2013   1keydata.com   All Rights Reserved   Privacy Policy

  • CSS Tutorial
    CSS Syntax
    Apply CSS
    CSS Media Types
    CSS Cascade
    CSS Inheritance
    CSS Class ID
    CSS Div Span
    CSS Length Units

    CSS Box Model
    CSS Margin
    CSS Border
    CSS Padding
    CSS Background
      CSS Background-attachment
      CSS Background-color
      CSS Background-image
      CSS Background-position
      CSS Background-repeat
    CSS Color
    CSS Font
    CSS Link
    CSS List
    CSS Table
    CSS Position
      CSS Absolute
      CSS Relative
      CSS Fixed
      CSS Static
      CSS Top
      CSS Bottom
      CSS Left
      CSS Right
      CSS Overflow
      CSS Z-Index
    CSS Text
    CSS Float
    CSS Clear
    CSS Cursor
    CSS Wrap

    CSS Codes

    Resources

    CSS Tutorial German