chromium/src/third_party/blink/web_tests/fast/multicol/composited-layer-single-fragment.html - manifest_repos/chromium_src - Git at Google

 <!DOCTYPE html>
 <style>
 .multicol {
     width: 60px;
     -webkit-column-width: 20px;
     -webkit-column-gap: 0;
     column-fill: auto;
     height: 60px;
 }
 .square {
     width: 20px;
     height: 20px;
     background: green;
 }
 .layer { will-change: transform; }
 </style>

 <p>There should a green square below.</p>
 <div class="multicol">
     <div class="square"></div>
     <div class="square"></div>
     <div class="layer"> <!-- bottom of first column -->
         <div class="square"></div>
     </div>
     <div class="square"></div>
     <div class="layer"> <!-- middle of second column -->
         <div class="square"></div>
     </div>
     <div class="square"></div>
     <div class="layer"> <!-- entire third column -->
         <div class="square"></div>
         <div class="square"></div>
         <div class="square"></div>
     </div>
 </div>
	<!DOCTYPE html>
	<style>
	.multicol {
	width: 60px;
	-webkit-column-width: 20px;
	-webkit-column-gap: 0;
	column-fill: auto;
	height: 60px;
	}
	.square {
	width: 20px;
	height: 20px;
	background: green;
	}
	.layer { will-change: transform; }
	</style>

	<p>There should a green square below.</p>
	<div class="multicol">
	<div class="square"></div>
	<div class="square"></div>
	<div class="layer"> <!-- bottom of first column -->
	<div class="square"></div>
	</div>
	<div class="square"></div>
	<div class="layer"> <!-- middle of second column -->
	<div class="square"></div>
	</div>
	<div class="square"></div>
	<div class="layer"> <!-- entire third column -->
	<div class="square"></div>
	<div class="square"></div>
	<div class="square"></div>
	</div>
	</div>