8 -webkit-transform-style: perserve-3d;
9 -webkit-perspective: 1000px;
15 background-color: blue;
22 -webkit-transform: translate(100px, 50px);
23 background-color: red;
27 -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 100, 50, 0, 1);
28 background-color: green;
31 <script type="text/javascript">
34 if (!window.testRunner) {
38 var element1 = document.getElementById(id1);
39 var element2 = document.getElementById(id2);
40 var x1 = element1.getBoundingClientRect().left;
41 var y1 = element1.getBoundingClientRect().top;
42 var x2 = element2.getBoundingClientRect().left;
43 var y2 = element2.getBoundingClientRect().top;
45 var resultString = '';
46 if (x1 == x2 && y1 == y2) {
47 resultString += "PASS - Element " + id1 + " and Element " + id2 + " had identical positions";
49 resultString += "FAIL - Element " + id1 + " and Element " + id2 + " had different positions";
52 document.body.appendChild(document.createTextNode(resultString));
57 <body onload="runTest();">
59 <!-- You should see green box only. If you see red, the test has failed -->
61 <div id='a' class="box translate"></div>
62 <div id='b' class="box matrix"></div>