CSS2 Test Suite: 17.6 border-collapse

[index page] [section] [Previous] [Next] [Specification]

The style declarations contained within this page:

table {background: gray; width: 300px; padding: 10px; border-spacing: 3px;}
table td {background: #FF9; color: black; border: 2px outset silver;}
.cl1 {border-collapse: separate;}
.cl2 {border-collapse: collapse;}

table.cl3 { border-collapse: collapse; border: 5px solid yellow; }
table.cl3 col#col1 { border: 3px solid black; }
table.cl3 td { border: 1px solid red; padding: 1em; }
table.cl3 td.solid-blue { border: 5px dashed blue; }
table.cl3 td.solid-green { border: 5px solid green; }



The following 'table' element should have 3 pixels of space between its cells (both horizontally and vertically) and 10 pixels of padding around the outer edge of the table. In addition, each cell should have a two-pixel outset border, with each border separate from the others.

[cl1]r1c2r1c3
r2c1r2c2r2c3
r3c1r3c2r3c3

The following 'table' element should not have 3 pixels of space between its cells (both horizontally and vertically), not should it have 10 pixels of padding around the outer edge of the table. The cells should not be separated except by their borders, and the borders should appear to "merge" so that cells share borders.

[cl2]r1c2r1c3
r2c1r2c2r2c3
r3c1r3c2r3c3

The following 'table' element, with a class of 'cl3', is a test of the collapsed-borders model.

1 2 3
4 5 6
7 8 9
10 11 12
13 14 15

[index page] [section] [Previous] [Next] [Specification]