<html xmlns="http://www.w3.org/1999/xhtml">
 <head>
  <title>CSS Positioning: Containing Block of Top Level Absolutely Positioned Elements</title>
  <style type="text/css">
   html { margin: 1em; border: 0; padding: 1em 5em 1em 1em; background: red; color: white; }
   body { margin: 1em; padding: 1em 20em 1em 1em; background: red; color: white; height: 0; }
   div { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: green; z-index: -1; }
  </style>
 </head>
 <body>
  <p>This page should be green.</p>
  <div></div>
  <!-- the <div> element should exactly underlap the viewport element,
  since the viewport is the containing block and the div is sized to
  fit its containing block. The canvas should be red (since the 
  background propagates -->
 </body>
</html>