third_party/WebKit/LayoutTests/css3/flexbox/auto-height-dynamic.html

   1 <!DOCTYPE html>
   2 <html>
   3 <link href="resources/flexbox.css" rel="stylesheet">
   4 <style>
   5 .flexbox {
   6     width: 600px;
   7     background-color: #aaa;
   8     position: relative;
   9 }
  10 .flexbox :nth-child(1) {
  11     background-color: blue;
  12 }
  13 </style>
  14 <script src="../../resources/check-layout.js"></script>
  15 <body onload="checkLayout('.flexbox')">
  16
  17 <div class="flexbox column" data-expected-height=0>
  18     <div class="flexitem" data-expected-height=0 style="flex: 100px"></div>
  19 </div>
  20
  21 <div class="flexbox column" data-expected-height=0>
  22     <div class="flexitem2" data-expected-height=0 style="flex: 100px"></div>
  23 </div>
  24
  25 <script>
  26 document.querySelector('.flexitem').offsetHeight;
  27 document.querySelector('.flexitem2').offsetHeight;
  28 document.querySelector('.flexitem').style.flex = "1";
  29 document.querySelector('.flexitem2').style.flex = "1 auto";
  30 </script>
  31
  32 </body>
  33 </html>