What is the default width of an HTML table cell <td>?

Question

I haven't been able to find the answer to this question: Where in the spec or in UA documentation is the default width of a <td> defined?

I've searched the HTML Living Standard, the HTML5 Recommendation, and various other sources.

My understanding (based on usage and observation) is that a table cell will, by default, occupy the full width of the column in which it lives. And the cell cannot be given a different width than the column if other cells exist in the column.

I'm looking for official confirmation of this behavior, preferably in W3C or user agent documentation. But any authoritative reference is acceptable.

Answer 1

The physical/visual width of a table cell is defined not by HTML, but by CSS. The CSS 2.1 specification has an entire section dedicated to table layout that complements HTML's description of tabular data.

Furthermore, CSS itself does not fully define how the width of a cell is calculated. It does with the fixed table layout algorithm:

In the fixed table layout algorithm, the width of each column is determined as follows:

1. A column element with a value other than 'auto' for the 'width' property sets the width for that column.
2. Otherwise, a cell in the first row with a value other than 'auto' for the 'width' property determines the width for that column. If the cell spans more than one column, the width is divided over the columns.
3. Any remaining columns equally divide the remaining horizontal table space (minus borders or cell spacing).

The width of the table is then the greater of the value of the 'width' property for the table element and the sum of the column widths (plus cell spacing or borders). If the table is wider than the columns, the extra space should be distributed over the columns.

but it doesn't give anything beyond a rough guideline for auto table layout, which user agents are free to follow or deviate from (it lists a step-by-step procedure not unlike that of fixed table layout, but that entire list is non-normative). Generally you can expect consistent behavior from UAs in the most common scenarios — as you observe, an auto-sized table cell generally takes up as much space as required by its content, and no more. But dig into edge cases, and you'll find all sorts of crazy.

Answer 2

Here's the W3C standards on calculating the width of table columns. Basically it is left up to the implementing browser/agent.

If an author specifies no width information for a column, a user agent may not be able to incrementally format the table since it must wait for the entire column of data to arrive in order to allot an appropriate width.

If column widths prove to be too narrow for the contents of a particular table cell, user agents may choose to reflow the table.

Source: http://www.w3.org/TR/html401/struct/tables.html#h-11.2.4.4

Note: this is HTML4 docs.