| <!DOCTYPE html> |
| <html> |
| <head> |
| <script> |
| if (window.testRunner) |
| testRunner.dumpAsText(); |
| |
| function log(str) { |
| var li = document.createElement("li"); |
| li.appendChild(document.createTextNode(str)); |
| var console = document.getElementById("console"); |
| console.appendChild(li); |
| } |
| |
| function findPosX(obj) { |
| var ret = 0; |
| do { |
| ret += obj.offsetLeft; |
| obj = obj.offsetParent; |
| } while (obj); |
| return ret; |
| } |
| |
| // This code was reduced from the menu system on doula.co.il which is why we call offsetParent.offsetLeft rather than |
| // just retreiving the element directly. |
| function printDivPlacement() { |
| var the_node = document.getElementById('menu_node'); |
| log("node.offsetParent.offsetLeft=" + the_node.offsetParent.offsetLeft + " (Should be 302 as in FF and IE)"); |
| log("findPosX=" + findPosX(the_node.offsetParent) + " (Should be 302 as in FF and IE)"); |
| } |
| </script> |
| </head> |
| <body onload="printDivPlacement()"> |
| <div style="position:absolute; top:0px; left:0px; width:800px; background-color:#C3DCBF;"> |
| <table width="200px" style="margin: auto;"> |
| <tr> |
| <td style="position:relative"> |
| <div id=menu_node>Menu Node</div> |
| </td> |
| </tr> |
| </table> |
| </div> |
| <br><br> |
| <h3>This test verifies that offsetLeft is calculated correctly for a relatively positioned td element.</h3> |
| <ul id=console></ul> |
| </body> |
| </html> |
