<html xmlns="http://www.w3.org/1999/xhtml">
 <head>
  <title>foreignObject is an abs pos containing block</title>
  <style type="text/css">
   html { padding: 8px; margin: 0; }
   body { margin: 0; padding: 0; }
   div { width: 200px; height: 200px; }
   .control { background: red; color: yellow; position: absolute; top: -200px; }
   .test { position: absolute; left: 8px; top: 8px; background: white; }
  </style>
 </head>
 <body>
  <div class="test"> There should be a green circle below with no red on this page. </div>
  <svg style="margin-top: 200px; overflow: visible" xmlns="http://www.w3.org/2000/svg" width="200" height="200">
   <circle cx="100" cy="100" r="50" fill="green"/>
   <foreignObject x="0" y="0" width="200" height="200">
     <div xmlns="http://www.w3.org/1999/xhtml" class="control">FAIL</div>
   </foreignObject>
  </svg>
 </body>
</html>