chromium/src/third_party/blink/web_tests/fast/replaced/replaced-child-of-absolute-with-auto-height.html - manifest_repos/chromium_src - Git at Google

 <html>
     <head>
         <style type='text/css'>
             .container {
                 position: absolute;
                 top: 30px;
                 bottom: 30px;
                 width: 300px;
                 background: yellow;
                 border: 2px dashed black;
             }
             .test {
                 height: 50%;
                 width: 296px;
                 background: blue;
                 border: 2px dashed black;
             }
         </style>
     </head>
     <body>
         <p>The inner blue image should be 50% as tall as the outer yellow box.</p>
         <div class="container">
             <img class="test" src="resources/square-blue-100x100.png">
         </div>
     </body>
 </html>
	<html>
	<head>
	<style type='text/css'>
	.container {
	position: absolute;
	top: 30px;
	bottom: 30px;
	width: 300px;
	background: yellow;
	border: 2px dashed black;
	}
	.test {
	height: 50%;
	width: 296px;
	background: blue;
	border: 2px dashed black;
	}
	</style>
	</head>
	<body>
	<p>The inner blue image should be 50% as tall as the outer yellow box.</p>
	<div class="container">
	<img class="test" src="resources/square-blue-100x100.png">
	</div>
	</body>
	</html>