Spacing for Table 1 is 10px. This makes a cellpadding of 10 pixels around each cell. Table background-color is pink.
Spacing for Table 2 is now 10px for the sides, but 50px for the padding of each row of cells. Note: IE8 supports the border-spacing property if a !DOCTYPE is specified.
Spacing for Table 3 is now 50px for both the sides and the padding for each row of cells. Even though I specified a color (bgcolor) for each <tr> row, the color didn't show.
For Table 4 I first specified border-collapse:none. It looked like Table #3 above. Then I removed the border-collapse property - and it still looked like Table #3! So then I added background-color: pink; to the head code for the 4th table. This is the only way to get the cellspacing colored.
Border Styles Introduction ~ 2 ~ 3
Border Color Introduction ~ 2
Border Radius: Introduction ~ 2
Border Collapse Spacing ~
Pinning an Element
An older Border Playground from 2008
Visit these other Tutorials by Flo
Friday 23rd of March 2018 06:35:26 PM