Ryan Smith
Ryan Smith

Reputation: 8324

Why are cellspacing and cellpadding not CSS styles

I don't know why this bothers me so much, but when I create websites, I always try to do all my styling with CSS. However one thing I always have to remember to do when I'm working with tables is add cellspacing="0" and cellpadding="0"

Why is there not a CSS property to override these antiquated HTML 4 attributes?

Upvotes: 52

Views: 44271

Answers (6)

verdy_p
verdy_p

Reputation: 1833

It's still a shame that cells cannot inherit their default padding from a CSS property of the row (tr), otherwise from rowgroup (thead/tbdy/tfoot) if it's not "initial", colgroup if it's not "initial", or the whole table.

"cellspacing" dos not have this problem (but in fact they are margins around cells, and these outer margins collapse with margins of the neighouring cells, and with the inner paddings of the table/rowgroup or row, where they are filled by the table's "background" setting (the table background also includes the table's "border" which is drawn on top of it and that also clips this background on the outer edge of the table's border, notably when this border has rounded corners).

But for the cellpadding, It would be jut simpler to defined "cell-padding: n" as a table or group property rather than on each cell separately and explicitly with its own "border: n" style (which should only be used if we need to override the padding in some specific cells).

Upvotes: 0

Simon_Weaver
Simon_Weaver

Reputation: 145980

Eric Myer's reset stylesheet contains the following 'reset' style for table :

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

In addition TD, TR are reset :

thead, tr, th, td {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}

The reason I mention this is that he has a comment 'tables still need cellpadding=0'. I assume he put this in here for a reason - probably needed by some old browsers. Judging by the fact that this is one of the very few comments he included I'm guessing its important and that there's a good reason for it.

Based on this comment - and this comment alone! - i'm continuing to use cellspacing="0" in the markup unless someone tells me definitively (below) why I dont need to. It could however likely be unnecessary in any modern browser worth supporting these days.

Upvotes: 9

user42092
user42092

Reputation:

mat already answered, but just for completeness:

  • paddingcellpadding
  • border-spacingcellspacing
  • border-collapse → no HTML equivalent

It's also worth remembering that you can set separate horizontal and vertical values for the CSS ones e.g. border-spacing: 0 1px.

Upvotes: 42

Din
Din

Reputation: 167

I guess somebody considered cell spacing a “bad practice”. How I understand it is equivalent included in CSS2 standard but IE does not support this property. border-collapse allows to set spacing to 0 value. Cell padding may be achieved setting padding property to TD elements of a table.

Upvotes: 0

mat
mat

Reputation: 13353

Cellspacing :

table { border-collapse: collapse; }

As for cellpadding, you can do

table tr td, table tr th { padding: 0; }

Upvotes: 64

Jimmy
Jimmy

Reputation: 91472

table { border-collapse:collapse; }

Upvotes: 0

Related Questions