third_party/WebKit/LayoutTests/fast/block/positioning/positioned-movement-layout-when-width-changes-expected.html

   1 <!DOCTYPE HTML>
   2 <style>
   3     body {
   4         margin: 0;
   5     }
   6     #top {
   7         position: relative;
   8         height: 500px;
   9         width: 500px;
  10     }
  11     #container {
  12         position: absolute;
  13         top: 0px;
  14         bottom: 0px;
  15         left: 0px;
  16         right: 0px;
  17         overflow: hidden;
  18     }
  19     #test {
  20         position: absolute;
  21         top: 0px;
  22         bottom: 0px;
  23         left: 0px;
  24         right: 140px;
  25         overflow: hidden;
  26     }
  27     .contents {
  28         display: inline-block;
  29         background-color: green;
  30         height: 100px;
  31         width: 100px;
  32         overflow: hidden;
  33     }
  34 </style>
  35 <script>
  36
  37     function addChildren(test)
  38     {
  39         for (i = 0; i < 20; i++) {
  40             box = document.createElement("div");
  41             box.setAttribute('class', 'contents');
  42             box.setAttribute('id', i);
  43             test.appendChild(box);
  44         }
  45     }
  46
  47     function runTest()
  48     {
  49         test = document.getElementById("test");
  50         addChildren(test);
  51     }
  52     window.onload = runTest;
  53 </script>
  54 <div id="top">
  55 <div id="container">
  56     <div id="test"></div>
  57 </div>
  58 </div>
  59 crbug.com/426166: Tests positioned movement layout when it needs to layout children because it's width has changed.