LayoutTests/fast/borders/dotted-border-on-subpixel-position-expected.html - WebKit - Git at Google

 <!DOCTYPE html>
 <html>
 <head>
 <title>This tests that dotted border is painted properly when on subpixel position.</title>
 <style>
 	div {
   		position: absolute;
   		width: 10px;
   		height: 10px;
   	}

 	.border1 {
 		border-top: 1px dotted blue;
 	}

 	.border2 {
 		border-bottom: 1px dotted blue;
 	}

 	.border3 {
 		border-left: 1px dotted blue;
 	}

 	.border4 {
 		border-right: 1px dotted blue;
 	}
 </style>
 </head>
 <body>
 <script>
     function createDashedBox(x, y, side) {
 		var box = document.createElement("div");
 		box.style.left = x + "px";
 		box.style.top = y + "px";
 		box.className = "border" + side;
 		document.body.appendChild(box);
     }

 	for (side = 1; side <= 4; ++side) {
 	    var x = 0;
     	var y  = 0;
 		for (i = 0; i < 10; ++i) {
 			createDashedBox(x, 0, side);
 			x += 14;
 		}

 		for (i = 0; i < 40; ++i) {
 			if (!(i % 20))
 				y += 1;
 			createDashedBox(x, y, side);
 			x += 14;
 		}
 	}
 </script>
 </body>
 </html>
	<!DOCTYPE html>
	<html>
	<head>
	<title>This tests that dotted border is painted properly when on subpixel position.</title>
	<style>
	div {
	position: absolute;
	width: 10px;
	height: 10px;
	}

	.border1 {
	border-top: 1px dotted blue;
	}

	.border2 {
	border-bottom: 1px dotted blue;
	}

	.border3 {
	border-left: 1px dotted blue;
	}

	.border4 {
	border-right: 1px dotted blue;
	}
	</style>
	</head>
	<body>
	<script>
	function createDashedBox(x, y, side) {
	var box = document.createElement("div");
	box.style.left = x + "px";
	box.style.top = y + "px";
	box.className = "border" + side;
	document.body.appendChild(box);
	}

	for (side = 1; side <= 4; ++side) {
	var x = 0;
	var y = 0;
	for (i = 0; i < 10; ++i) {
	createDashedBox(x, 0, side);
	x += 14;
	}

	for (i = 0; i < 40; ++i) {
	if (!(i % 20))
	y += 1;
	createDashedBox(x, y, side);
	x += 14;
	}
	}
	</script>
	</body>
	</html>