<DOCTYPE html>
<html>
<head>
<title>This tests that dotted borders look ok.</title>
<style>
  div {
    position: absolute;
    border: 1px dotted green;
  }
</style>
</head>
<body>
<pre id=container></pre>
<script>
  var cont = document.getElementById("container");
  var borderWidth = 1;
  for (h = 0; h < 500; h += 180) {
    for (v = 0; v < 500; v += 180) {
      width = 0;
      for (i = 90; i >= 0; i -= 2 * borderWidth) {
        var element = document.createElement("div");
        element.style.top = h + i + "px";
        element.style.left = v + i + "px";
        element.style.width = width + "px";
        element.style.height = width + "px";
        element.style.borderWidth = borderWidth;
        cont.appendChild(element);
        width += 4 * borderWidth;
      }
      borderWidth += 1;
    }
  }
</script>
</body>
</html>