| <!DOCTYPE html> |
| <html> |
| <head> |
| <title>This tests that when the parent container enforces clipping and it is on a subpixel position, we snap child content properly.</title> |
| <style> |
| .container { |
| width: 15px; |
| height: 15px; |
| position: absolute; |
| } |
| |
| .inner { |
| width: 10px; |
| height: 10px; |
| border: 1px solid red; |
| -webkit-transform: translateZ(0); |
| } |
| </style> |
| </head> |
| <body> |
| </div> |
| <script> |
| var body = document.body; |
| var x = 0; |
| var y = 0; |
| for (i = 0; i < 20; ++i) { |
| y = 0; |
| for (j = 0; j < 20; ++j) { |
| var container = document.createElement("div"); |
| container.style.top = 15 * i + y + "px"; |
| container.style.left = 15 * j + x + "px"; |
| container.className = "container"; |
| body.appendChild(container); |
| |
| var inner = document.createElement("div"); |
| inner.className = "inner"; |
| container.appendChild(inner); |
| y += 0.1; |
| } |
| x += 0.1; |
| } |
| </script> |
| </body> |
| </html> |