Back to my Opera Bugs page

Collapsed Table Borders

The CSS 2.1 spec on border conflict resolution is clear on how to draw borders. Earlier versions were not.

Test in your browser

<style type="text/css">
table.test td { border-width: 8px; border-style: solid; }
</style>
<table class="test" summary="Test" style="border-collapse: collapse">
<tr>
<td style="border-color: red">R</td>
<td style="border-color: green">G</td>
<td style="border-color: blue">B</td>
</tr>
<tr>
<td style="border-color: green">G</td>
<td style="border-color: blue">B</td>
<td style="border-color: red">R</td>
</tr>
<tr>
<td style="border-color: blue">B</td>
<td style="border-color: red">R</td>
<td style="border-color: green">G</td>
</tr>
</table>

Rendering in various browsers

Opera renders the table borders such the the border to the right or bottom has precendence (Opera probably renders left-right top-bottom and the later borders are drawn over the top of earlier borders). IE 7 is the only browser that conforms to the published spec.

Opera 9.62
IE 7.0.5730.11 CSS2.1 Standard
Firefox 3.04
Safari 3.2 (525.26.13)

Back to my Opera Bugs page