third_party/WebKit/LayoutTests/fast/block/positioning/height-change.html

   1 <html>
   2 <head>
   3 <style type="text/css">
   4 .articlefooter {
   5     position: absolute;
   6     bottom: 0;
   7     width: 100px;
   8     background-color: lightgreen;
   9     height: 50px;
  10 }
  11 </style>
  12 <title></title>
  13 </head>
  14 <body>
  15 <p>
  16     This tests for a regression against
  17     <i><a href="https://bugs.webkit.org/show_bug.cgi?id=6881">http://bugzilla.opendarwin.org/show_bug.cgi?id=6881</a>
  18     Block with position:absolute bottom:0 doesn't always move when height of containing block changes (affects Safari RSS)</i>.
  19 </p>
  20 <p>
  21     The squares below should have blue tops and green bottoms, not the other way around.
  22 </p>
  23 <hr>
  24 <div style="position: relative;">
  25     <div class=articlefooter></div>
  26     <div id="t" style="background: skyblue; height: 50px; width: 100px;"></div>
  27 </div>
  28 <br>
  29 <div style="position: relative; display: -webkit-box;">
  30     <div class=articlefooter></div>
  31     <div id="u" style="background: skyblue; height: 50px; width: 100px;"></div>
  32 </div>
  33 <script type="text/javascript">
  34     document.body.offsetTop;    // force layout
  35     t.style.height = '100px';
  36     u.style.height = '100px';
  37 </script>
  38 </body>