chromium/src/third_party/blink/web_tests/external/wpt/css/css-break/block-max-height-001-ref.html - manifest_repos/chromium_src - Git at Google

 <!DOCTYPE html>
 <html>
 <head>
   <title>Reference: max-height block fragmentation</title>
   <link rel="author" title="Mats Palmgren" href="mailto:mats@mozilla.com">
   <style>
 html,body {
     color:black; background-color:white; font:24px/1 monospace; padding:0; margin:0;
     width: 300px;
 }
 .columns {
   columns: 3;
   background: grey;
   margin-bottom: 1em;
 }
 .columns > div { height:160px; background: yellow; }
 .columns > div > div { height:200px; width:50px; border:solid; }
   </style>
 </head>
 <body>
 <div class="columns">
   BEFORE
   <div>
     <div></div>
   </div>
   AFTER
 </div>
 <div class="columns" style="height:100px">
   BEFORE
   <div>
     <div></div>
   </div>
   AFTER
 </div>
 <div class="columns" style="height:70px">
   BEFORE
   <div>
     <div></div>
   </div>
   AFTER
 </div>
 <div class="columns" style="height:50px">
   BEFORE
   <div>
     <div></div>
   </div>
   AFTER
 </div>
 </body>
 </html>
	<!DOCTYPE html>
	<html>
	<head>
	<title>Reference: max-height block fragmentation</title>
	<link rel="author" title="Mats Palmgren" href="mailto:mats@mozilla.com">
	<style>
	html,body {
	color:black; background-color:white; font:24px/1 monospace; padding:0; margin:0;
	width: 300px;
	}
	.columns {
	columns: 3;
	background: grey;
	margin-bottom: 1em;
	}
	.columns > div { height:160px; background: yellow; }
	.columns > div > div { height:200px; width:50px; border:solid; }
	</style>
	</head>
	<body>
	<div class="columns">
	BEFORE
	<div>
	<div></div>
	</div>
	AFTER
	</div>
	<div class="columns" style="height:100px">
	BEFORE
	<div>
	<div></div>
	</div>
	AFTER
	</div>
	<div class="columns" style="height:70px">
	BEFORE
	<div>
	<div></div>
	</div>
	AFTER
	</div>
	<div class="columns" style="height:50px">
	BEFORE
	<div>
	<div></div>
	</div>
	AFTER
	</div>
	</body>
	</html>