Border style test of collapsing between TABLE and TD

This test features the CSS border conflict resolution by collapsing each border style. Borders have the same color and width, thus 'border-style' strength ordering should specify whether the table's or the td's border is visible.

• Small tables in every row have another 'table' style (outer border)
• Small tables in every column have another 'td' style (inner border + collapse with outer border)
• Styles are: hidden, none, double, solid, dashed, dotted, ridge, outset, groove, inset, like CSS 2.1 border conflict resultion orders them.
• Note that while 'hidden' is the strongest and forces to hide, 'none' does not take precedence on the weaker styles.
• Red "bug indicators" are used on the outer border only, since that's the place where the borders conflict. Thus some green but still invalid borders may appear inside the tables in some cases (e.g. first column of IE6 and 7).

Some details

• No red borders should be visible at all
• IE below 8 (beta 1) fails because it always takes 'table' more important than 'td'
• First row, table must not have a surronding border (table=hidden)
• First column, no border may appear (td=hidden)
• 'inset' should fall back to 'groove' (IE 6-8b1 renders 'inset')
• 'outset' should fall back to 'ridge' (IE 6-8b1 renders 'outset')
• Caused by this fall back two combinations (when falling types conflict) are not clearly specified, thus those may fail (red border) in some more browsers too

Please see the screenshots in various browsers.

Test tables

© Copyright 2008, Ferenc Veres