css clear both

CSS
/* Answer to: "css clear both" */

/*
  Syntax:
  clear: none|left|right|both|initial|inherit;

  Does not allow floating elements on the left or the right side
  of a specified element, in this case, the <p> element:
*/

img {
  float: left;
}

p.clear {
  clear: both;
}CSS Syntax
clear: none|left|right|both|initial|inherit;
Property Values
Value	Description
none	Default. Allows floating elements on both sides
left	No floating elements allowed on the left side
right	No floating elements allowed on the right side
both	No floating elements allowed on either the left or the right side
initial	Sets this property to its default value. Read about initial
inherit	Inherits this property from its parent element. Read about inherit

<!DOCTYPE html>
<html>
<head>
<style>
img {
  float: left;
}

p.clear {
  clear: both;
}
</style>
</head>
<body>

<h1>The clear Property</h1>

<img src="w3css.gif" width="100" height="132">
<p>This is some text. This is some text. This is some text. This is some text. This is some text. This is some text.</p>
<p class="clear">This is also some text. This is also some text. This is also some text. This is also some text. This is also some text. This is also some text.</p>
<p><strong>Remove the "clear" class to see the effect.</strong></p>

</body>
</html>
Source