LayoutTests/fast/flexbox/016.html - WebKit - Git at Google

 <html>
 <head>
 <style>
 .middle {
   background-color:green;
   -moz-box-flex: 1;
   -webkit-box-flex: 1;
   box-flex: 1;
   border: 10px solid olive;
 }

 html {
   background-color: white;
   height: 100%;
 }

 body {
   height: 100%;
   margin: 0px;
 }

 div.outer {
   display: -moz-box;
   display: -webkit-box;
   display: box;
   -moz-box-orient: vertical;
   -webkit-box-orient: vertical;
   box-orient: vertical;
   height: 100%;
   width: 100%;
 }
 </style>
 </head>
 <body>
 <div class="outer">
 <div>
 This header should remain at the top of the browser window as you resize it.  It
 can wrap to multiple lines.  The center should be filled with an olive-bordered
 green box.  It should start beneath the header, end above the footer, and fill the width of the
 browser window.
 </div>
 <!--<div class="middle"></div>-->
 <iframe class="middle" style="display: block; width:99%" src="about:blank"></iframe>
 <div>
 This footer should remain at the bottom of the browser window.  It
 can wrap to multiple lines if necessary.
 </div>
 </div>
 </body>
 </html>
	<html>
	<head>
	<style>
	.middle {
	background-color:green;
	-moz-box-flex: 1;
	-webkit-box-flex: 1;
	box-flex: 1;
	border: 10px solid olive;
	}

	html {
	background-color: white;
	height: 100%;
	}

	body {
	height: 100%;
	margin: 0px;
	}

	div.outer {
	display: -moz-box;
	display: -webkit-box;
	display: box;
	-moz-box-orient: vertical;
	-webkit-box-orient: vertical;
	box-orient: vertical;
	height: 100%;
	width: 100%;
	}
	</style>
	</head>
	<body>
	<div class="outer">
	<div>
	This header should remain at the top of the browser window as you resize it. It
	can wrap to multiple lines. The center should be filled with an olive-bordered
	green box. It should start beneath the header, end above the footer, and fill the width of the
	browser window.
	</div>
	<!--<div class="middle"></div>-->
	<iframe class="middle" style="display: block; width:99%" src="about:blank"></iframe>
	<div>
	This footer should remain at the bottom of the browser window. It
	can wrap to multiple lines if necessary.
	</div>
	</div>
	</body>
	</html>