<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>

 <head>

  <title>CSS Test: Margin collapsing with clearance - margins of a 'collapsed through' box with clearance do not collapse with parent block's bottom margin</title>

 <style type="text/css">

  #parent-red
  {
  background-color: yellow;
  border-top: black solid 1px;
  width: 50%;
  height: 151px;
  }
  #parent-lime
  {
  background-color: lime;
  border-top: black solid 1px;
  width: 100%;
  }

  #float-left-blue
  {
  background-color: lime;
  float: left;
  height: 100px;
  width: 100px;
  }

  #clear-left
  {
  clear: left;
  margin-top: 10px;
  margin-bottom: 10px;
  }

  #other
  {
  height: 30px;
  margin-bottom: 20px;
  }

 </style>

 </head>

 <body>

  <p>Test passes if there is a yellow rectangle below the lime rectangle.</p>

  <div id="parent-red">
    <div id="parent-lime">
      <div id="float-left-blue"></div>
      <div id="clear-left"></div>
      <div id="other"></div>
    </div>
  </div>
 </body>
</html>