third_party/WebKit/LayoutTests/css3/flexbox/width-change-and-relayout-children.html

   1 <!DOCTYPE html>
   2 <html>
   3 <head>
   4 <link href="resources/flexbox.css" rel="stylesheet">
   5 <style>
   6 .flexitem {
   7     width: 100%;
   8     height: 3em;
   9     min-height: 3em;
  10 }
  11 .child {
  12     background-color: salmon;
  13 }
  14 </style>
  15 <script src="../../resources/check-layout.js"></script>
  16 </head>
  17 <body>
  18 <div id="container" style="width: 100px" data-expected-width="200">
  19 <div class="flexbox column" data-expected-width="200">
  20     <div class="flexitem" data-expected-width="200">
  21         <div class="child" data-expected-width="200">This div should be 200px wide.</div>
  22     </div>
  23 </div>
  24 </div>
  25 <script>
  26 var container = document.getElementById('container');
  27 container.offsetWidth;
  28 container.style.width = "200px";
  29 window.onload = function()
  30 {
  31     checkLayout("#container");
  32 };
  33 </script>
  34 </body>
  35 </html>