LayoutTests/compositing/hidpi-sibling-composited-content-offset.html - WebKit - Git at Google

 <!DOCTYPE html>
 <html>
 <head>
 <title>This tests sibling composited content with subpixel positioning.</title>
 <style>
 .container {
   position: absolute;
   background-color: green;
   transform: translateZ(0);
   width: 15px;
   height: 15px;
 }

 .offset {
   background-color: blue;
   width: 5px;
   height: 5px;
   position: relative;
   }

 .jiggle {
   height: 5px;
   width: 5px;
   background-color: red;
   transform: translateZ(0);
 }
 </style>
 </head>
 <body>
 <script>
 var subpixelForContainer = 0;
 for (var i = 0; i < 20; ++i) {
   var subpixelForChild = -2;
   for (var j = 0; j < 20; ++j) {
     var container = document.createElement("div");
     container.className = "container";
     container.style.left = i * 20 + subpixelForContainer + "px";
     container.style.top = j * 20 + subpixelForContainer + "px";
     document.body.appendChild(container);
     subpixelForContainer += 0.05;

     var offset = document.createElement("div");
     offset.className = "offset";
     offset.style.left = subpixelForChild + "px";
     container.appendChild(offset);
     subpixelForChild += 0.05;

     var jiggle = document.createElement("div");
     jiggle.className = "jiggle";
     container.appendChild(jiggle);
   }
 }
 </script>
 </body>
 </html>
	<!DOCTYPE html>
	<html>
	<head>
	<title>This tests sibling composited content with subpixel positioning.</title>
	<style>
	.container {
	position: absolute;
	background-color: green;
	transform: translateZ(0);
	width: 15px;
	height: 15px;
	}

	.offset {
	background-color: blue;
	width: 5px;
	height: 5px;
	position: relative;
	}

	.jiggle {
	height: 5px;
	width: 5px;
	background-color: red;
	transform: translateZ(0);
	}
	</style>
	</head>
	<body>
	<script>
	var subpixelForContainer = 0;
	for (var i = 0; i < 20; ++i) {
	var subpixelForChild = -2;
	for (var j = 0; j < 20; ++j) {
	var container = document.createElement("div");
	container.className = "container";
	container.style.left = i * 20 + subpixelForContainer + "px";
	container.style.top = j * 20 + subpixelForContainer + "px";
	document.body.appendChild(container);
	subpixelForContainer += 0.05;

	var offset = document.createElement("div");
	offset.className = "offset";
	offset.style.left = subpixelForChild + "px";
	container.appendChild(offset);
	subpixelForChild += 0.05;

	var jiggle = document.createElement("div");
	jiggle.className = "jiggle";
	container.appendChild(jiggle);
	}
	}
	</script>
	</body>
	</html>