| <html> |
| <head> |
| <title>Layout test for WebKit bug 85581</title> |
| |
| <script> |
| if (window.testRunner) |
| testRunner.dumpAsText(); |
| |
| function log(message) |
| { |
| var console = document.getElementById('console'); |
| console.appendChild(document.createTextNode(message)); |
| console.appendChild(document.createElement('br')); |
| } |
| |
| function runTest() |
| { |
| var tableHeight = document.getElementById('table').offsetHeight; |
| var div1Height = parseInt(document.getElementById('div1').style.height); |
| var div2Height = parseInt(document.getElementById('div2').style.height); |
| var imageHeight = document.getElementById('image').height; |
| var contentsHeight = div1Height + div2Height + imageHeight; |
| |
| log("Height of table: " + tableHeight); |
| log("Height of table contents: " + contentsHeight); |
| if (contentsHeight < tableHeight) |
| log("PASS: Table contents do not overflow outside of table border."); |
| else |
| log("FAIL: Table contents overflow outside of table border."); |
| |
| } |
| </script> |
| |
| </head> |
| <body onload="runTest()"> |
| |
| <table id="table" style="width: 100%;" border="1"> |
| <tr> |
| <td style="vertical-align: top;"> |
| <div> |
| <p> |
| <div id="div1" style="height: 200px; width: 100%;"></div> |
| <img id="image" src="resources/square-blue-100x100.png" style="height: 60%;"> |
| <div id="div2" style="height: 20px; width: 100%;"></div> |
| </p> |
| </div> |
| </td> |
| </tr> |
| </table> |
| |
| <p> Layout test for <a href="https://bugs.webkit.org/show_bug.cgi?id=85581">WebKit bug 85581</a>. </p> |
| <p> This tests that the contents of a table do not overflow when the table contains an image with percentage height. For this test to pass, the blue rectangle should be entirely within the table border and/or you should see a 'PASS' message below. </p> |
| <p id="console"></p> |
| |
| </body> |
| </html> |
