<html>
<head>
<title>Table Repaint Test</title>

</head>
<script type="text/javascript">
<!--
    function Setup() { 
        setTimeout('RepaintBug()', 10);
        if (window.testRunner)
            testRunner.waitUntilDone();
    }
    function RepaintBug() {
        var div1 = document.getElementById("bug2");
        div1.style.color = 'green';
        if (window.testRunner)
            testRunner.notifyDone();
    }
//-->
</script>
  <body onLoad="Setup()">
    <p>
        This test checks the renderer's ability to layer multiple cells in a table on top of one another. This test has three cells that span multiple table grid slots. The <span style="color: red; font-weight: bold;">red</span> cell starts at row 1 and column 3 and spans three rows. The <span style="color: blue; font-weight: bold;">blue</span> cell starts at row 2, and column 2, and spans two columns and two rows. The <span style="color: green; font-weight: bold;">green</span> cell spans 4 columns of row 3.
    </p>
    <p>
        If the test succeeds then you should see no text inside the table. If you see the text 'FAIL' inside the table, then the test has failed.
    </p>
  <table border="1">
    <tbody>
    <tr>
      <td>&nbsp;&nbsp;&nbsp;&nbsp;</td>
      <td>&nbsp;&nbsp;&nbsp;&nbsp;</td>
      <td rowspan="3" valign="bottom" style="background-color:red;"><div id="bug1">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</div></td>
    </tr>
    <tr>
      <td>&nbsp;&nbsp;&nbsp;&nbsp;</td>
      <td rowspan="2" colspan="2" align="right" valign="bottom" style="background-color:blue;"><div id="bug2">&nbsp;&nbsp;&nbsp;FAIL&nbsp;&nbsp;</div></td>
    </tr>
    <tr>
      <td colspan="3" align="right" style="background-color:green;"><div id="bug3">&nbsp;&nbsp;</div></td>
    </tr>
    </tbody>
  </table>
  </body>
</html>
