| <html> |
| <head> |
| <style type="text/css"> |
| .articlefooter { |
| position: absolute; |
| bottom: 0; |
| width: 100px; |
| background-color: lightgreen; |
| height: 50px; |
| } |
| </style> |
| <title></title> |
| </head> |
| <body> |
| <p> |
| This tests for a regression against |
| <i><a href="https://bugs.webkit.org/show_bug.cgi?id=6881">http://bugzilla.opendarwin.org/show_bug.cgi?id=6881</a> |
| Block with position:absolute bottom:0 doesn't always move when height of containing block changes (affects Safari RSS)</i>. |
| </p> |
| <p> |
| The squares below should have blue tops and green bottoms, not the other way around. |
| </p> |
| <hr> |
| <div style="position: relative;"> |
| <div class=articlefooter></div> |
| <div id="t" style="background: skyblue; height: 50px; width: 100px;"></div> |
| </div> |
| <br> |
| <div style="position: relative; display: -webkit-box;"> |
| <div class=articlefooter></div> |
| <div id="u" style="background: skyblue; height: 50px; width: 100px;"></div> |
| </div> |
| <script type="text/javascript"> |
| document.body.offsetTop; // force layout |
| t.style.height = '100px'; |
| u.style.height = '100px'; |
| </script> |
| </body> |
