13 background-color: blue;
20 transform: translate(100px, 50px);
21 background-color: red;
25 background-color: green;
28 <script type="text/javascript">
32 if (!window.testRunner) {
36 var element1 = document.getElementById(id1);
37 var element2 = document.getElementById(id2);
38 var x1 = element1.getBoundingClientRect().left;
39 var y1 = element1.getBoundingClientRect().top;
40 var x2 = element2.getBoundingClientRect().left;
41 var y2 = element2.getBoundingClientRect().top;
43 var resultString = '';
44 if (x1 == x2 && y1 == y2) {
45 resultString += "PASS - Element " + id1 + " and Element " + id2 + " had identical positions";
47 resultString += "FAIL - Element " + id1 + " and Element " + id2 + " had different positions";
50 document.body.appendChild(document.createTextNode(resultString));
55 <body onload="runTest();">
57 <!-- You should see green box only. If you see red, the test has failed -->
59 <div id='a' class="box translate"></div>
60 <div id='b' class="box matrix"></div>
63 document.getElementById('b').style.webkitTransform = new WebKitCSSMatrix('matrix(1, 0, 0, 1, 100, 50)');