ManualTests/containing-block-position-change.html

   1 <html>
   2 <head>
   3     <title></title>
   4     <style type="text/css">
   5         #t { position: absolute; width: 100px; height: 100px; background: green; left: -120px; }
   6     </style>
   7     <script type="text/javascript">
   8         function test()
   9         {
  10             var container = document.getElementById("rel");
  11             var target = document.getElementById("t");
  12             document.body.offsetTop;   // force layout
  13             container.style.position = "relative";
  14             document.body.offsetTop;   // force layout
  15             target.style.left = "0";
  16         }
  17     </script>
  18 </head>
  19 <body onload="test()">
  20     <p>
  21         This is a test for <i><a href="http://bugs.webkit.org/show_bug.cgi?id=9121">http://bugs.webkit.org/show_bug.cgi?id=9121</a>
  22         REGRESSION: [Incremental Repaint] DHTML movement test failures</i>.
  23     </p>
  24     <p>
  25         Do not resize the window. If you did, reload the test.
  26     </p>
  27     <p>
  28         There should be a green square below, aligned with the left margin of the page.
  29     </p>
  30     <hr>
  31     <div id="rel" style="position: static;">
  32         <span id="t"></span>
  33     </div>
  34 </body>
  35 </html>