Question

Eric meyer reset css is suggesting “tables still need ‘cellspacing=”0″‘ in the markup”. Is it necessary? and what is the benefit of border-collapse: collapse; and border-spacing: 0;?

and it’s only suggesting to use cellspacing, while table has another property called cellpadding?

/* tables still need 'cellspacing="0"' in the markup */
table {
        border-collapse: collapse;
        border-spacing: 0;
}

Answer 1

cellpadding is not suggested because the padding css property sufficiently overrides the default properties for the cellpadding table attribute. As the other answer says, there is no compatible CSS property for cellspacing in older browsers, leaving an HTML attribute as the only way to completely “reset” this setting to 0. border-spacing: 0; takes care of this for browsers which do support it.

As for border-collapse — by default, table cells each have their own border, and collapse will merge the borders between adjacent cells together, giving the appearance of a (usually single-pixel) grid, which isn’t achievable any other way when cellspacing="0". Before border-collapse was commonly supported, this is why you’d see tables with cellspacing="1" and a background color on the table, and white backgrounds on table cells.

border-collapse:collapse; is in the reset.css simply because it is the most common desired result. If you don’t want this mode, you’d be fine removing this from the reset.css.