<html>
<head>
<title></title>
<style>
table { margin: 4px; border-collapse: collapse; }
tbody { background-color: yellow; }
tr { background-color: orange; }
td { width: 25px; height: 25px; }
.green { background-color: green; }
.red { background-color: red; }
</style>
</head>
<body>
<p>
This tests that the background of a table cell with <tt>visibility:hidden</tt> is never painted.
</p>
<p>
You should see nine green squares and no red, orange or yellow squares.
</p>
<table style="visibility: hidden;">
<tbody>
<tr>
<td class="red"></td>
</tr>
</tbody>
</table>
<table style="visibility: hidden;" class="red">
<tbody style="visibility: visible;">
<tr>
<td class="green"></td>
</tr>
</tbody>
</table>
<table style="visibility: hidden;" class="red">
<tbody>
<tr style="visibility: visible;">
<td class="green"></td>
</tr>
</tbody>
</table>
<table style="visibility: hidden;" class="red">
<tbody>
<tr>
<td style="visibility: visible;" class="green"></td>
</tr>
</tbody>
</table>
<table class="green">
<tbody style="visibility: hidden;" class="red">
<tr>
<td></td>
</tr>
</tbody>
</table>
<table class="red">
<tbody style="visibility: hidden;">
<tr style="visibility: visible;">
<td class="green"></td>
</tr>
</tbody>
</table>
<table class="red">
<tbody style="visibility: hidden;">
<tr>
<td style="visibility: visible;" class="green"></td>
</tr>
</tbody>
</table>
<table class="green">
<tbody>
<tr style="visibility: hidden;">
<td class="red"></td>
</tr>
</tbody>
</table>
<table class="red">
<tbody>
<tr style="visibility: hidden;">
<td style="visibility: visible;" class="green"></td>
</tr>
</tbody>
</table>
<table class="green">
<tbody>
<tr>
<td style="visibility: hidden;" class="red"></td>
</tr>
</tbody>
</table>
</body>
</html>
Codebase Browser
chromium