LayoutTests/css3/flexbox/auto-height-dynamic.html - WebKit - Git at Google

 <!DOCTYPE html>
 <html>
 <link href="resources/flexbox.css" rel="stylesheet">
 <style>
 .flexbox {
     width: 600px;
     background-color: #aaa;
     position: relative;
 }
 .flexbox :nth-child(1) {
     background-color: blue;
 }
 </style>
 <script src="../../resources/check-layout.js"></script>
 <body onload="checkLayout('.flexbox')">

 <div class="flexbox column" data-expected-height=0>
     <div class="flexitem" data-expected-height=0 style="-webkit-flex: 100px"></div>
 </div>

 <div class="flexbox column" data-expected-height=0>
     <div class="flexitem2" data-expected-height=0 style="-webkit-flex: 100px"></div>
 </div>

 <script>
 document.querySelector('.flexitem').offsetHeight;
 document.querySelector('.flexitem2').offsetHeight;
 document.querySelector('.flexitem').style.webkitFlex = "1";
 document.querySelector('.flexitem2').style.webkitFlex = "1 auto";
 </script>

 </body>
 </html>
	<!DOCTYPE html>
	<html>
	<link href="resources/flexbox.css" rel="stylesheet">
	<style>
	.flexbox {
	width: 600px;
	background-color: #aaa;
	position: relative;
	}
	.flexbox :nth-child(1) {
	background-color: blue;
	}
	</style>
	<script src="../../resources/check-layout.js"></script>
	<body onload="checkLayout('.flexbox')">

	<div class="flexbox column" data-expected-height=0>
	<div class="flexitem" data-expected-height=0 style="-webkit-flex: 100px"></div>
	</div>

	<div class="flexbox column" data-expected-height=0>
	<div class="flexitem2" data-expected-height=0 style="-webkit-flex: 100px"></div>
	</div>

	<script>
	document.querySelector('.flexitem').offsetHeight;
	document.querySelector('.flexitem2').offsetHeight;
	document.querySelector('.flexitem').style.webkitFlex = "1";
	document.querySelector('.flexitem2').style.webkitFlex = "1 auto";
	</script>

	</body>
	</html>