Layout- Float & Clear

Float Property

• Box Model is just like a box that wraps around every HTML element.
• A box model contains content, padding, border, and margin.

Values of Float Property

• left- The element floats to the left of its container.
• right - The element floats to the right of its container.
• The element does not float (will be displayed just where it occurs in the text). This is the default value of a float.
• inherit - The element inherits the float value of its parent

Using Float Property

Clear Property in CSS

• The clear CSS property sets whether an element must be moved below (cleared).
• The clear property specifies what should happen with the element that is next to a floating element.

Values of Clear Property

• none - The element is not pushed below left or right-floated elements. This is the default.
• left - The element is pushed below left-floated elements.
• right - The element is pushed below the right floated elements.
• both - The element is pushed below both left and right-floated elements.
• inherit - The element inherits the clear value from its parent

Using clear property

Introduction to CSS Part-2 PDF Click here to download