Internet Explorer 9 - Table Border Bug
... how to kill IE9
HTML
<p>Internet Explorer 9 seems to have a serious issue in its rendering engine. press the kill button...</p>
<button id="kill">kill</button>
<table class="ie9-crasher">
<tbody>
<tr class="asdasd">
<td colspan="2">first</td>
<td colspan="3" class="empty-cell"></td>
</tr>
<tr class="dummy">
<td>0</td>
<td colspan="4" class="empty-cell"></td>
</tr>
<tr class="dummy">
<td>1</td>
<td colspan="4" class="empty-cell"></td>
</tr>
<tr class="dummy" id="problematic">
<td>2</td>
<td colspan="4" class="empty-cell"></td>
</tr>
<tr class="asdasd">
<td colspan="2">last</td>
<td colspan="3" class="empty-cell"></td>
</tr>
</tbody>
</table>
CSS
.ie9-crasher {
border: 1px solid #CCCCCC;
}
.ie9-crasher td {
border: 1px solid #CCCCCC;
}
.ie9-crasher td.empty-cell {
border: none;
}
JavaScript
document.getElementById('kill').onclick = function() {
document.getElementById('problematic').style.display = 'none';
}