Clear left : clear « Layout « HTML / CSS






  1. HTML / CSS
  2. Layout
  3. clear

Clear left

 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<style type="text/css">
h2 {
 font:3em/1em Times, serif;
 font-weight: bold;
 margin:0;
 position: relative;
 overflow: hidden;
 float: left;
}
h2 span {
 position: absolute;
 width: 100%;
 height: 5em;
 background: red;
}
p {
 clear: left;
}
</style>
</head>
<body>
<h2><span>span</span>Header 2 Header 2 Header 2 Header 2 Header 2
</h2>
  <p>This is a test.</p>
</body>
</html>








Related examples in the same category

1.left clear to start a new line
2.clear right
3.clear: both
4.float: right and clear right
5.Use clear div as the divider
6.clear right and float right
7.clear left only
8.The clear property cancels the floating effects, and stop the wrapping.