# Table column N established by element “th” has no cells beginning in it.

> Canonical HTML version: https://rocketvalidator.com/html-validation/table-column-n-established-by-element-th-has-no-cells-beginning-in-it
> Attribution: Rocket Validator (https://rocketvalidator.com)
> License: CC BY 4.0 (https://creativecommons.org/licenses/by/4.0/)

The HTML specification requires that table structures be coherent — every column in a table must be "used" by at least one cell that starts in it. When you declare a `<th>` with `colspan="2"`, you're telling the browser that the table has (at least) two columns. If the body rows don't provide cells to fill those columns, the table's structure becomes inconsistent.

This matters for several reasons. Screen readers and other assistive technologies rely on a well-formed table grid to navigate and announce cell contents. An inconsistent column structure can confuse these tools, leading to a poor experience for users who depend on them. Browsers may also render such tables unpredictably, since they have to guess how to handle the mismatch.

Common causes of this error include:

- A `colspan` value on a header cell that exceeds the actual number of cells in body rows.
- Empty `<tbody>`, `<thead>`, or `<tfoot>` sections that leave declared columns without any cells.
- Rows with fewer cells than other rows define, leaving some columns unoccupied.
- Copy-paste errors or template issues where rows were deleted but headers were left unchanged.

To fix this, examine your table's column structure. Count the total number of columns implied by each row (accounting for `colspan` and `rowspan` attributes) and make sure every row agrees on the total column count. Every column should have at least one cell beginning in it somewhere in the table.

## Examples

### Incorrect: `colspan` creates columns with no matching body cells

Here, the header declares two columns, but the body is empty, so column 2 has no cells beginning in it:

```html
<table>
  <thead>
    <tr>
      <th colspan="2">The table header</th>
    </tr>
  </thead>
  <tbody>
  </tbody>
</table>
```

### Incorrect: Body rows have fewer cells than the header defines

The header spans three columns, but the body rows only have two cells each. Column 3 has no cells beginning in it:

```html
<table>
  <thead>
    <tr>
      <th colspan="3">Wide header</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Cell 1</td>
      <td>Cell 2</td>
    </tr>
  </tbody>
</table>
```

### Correct: Body cells match the columns defined by the header

The header spans two columns, and the body row provides exactly two cells:

```html
<table>
  <thead>
    <tr>
      <th colspan="2">The table header</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>The table body</td>
      <td>with two columns</td>
    </tr>
  </tbody>
</table>
```

### Correct: Three-column header with matching body cells

```html
<table>
  <thead>
    <tr>
      <th>Name</th>
      <th>Role</th>
      <th>Status</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Alice</td>
      <td>Developer</td>
      <td>Active</td>
    </tr>
  </tbody>
</table>
```

### Correct: Using `colspan` in body rows to fill all columns

If you need fewer visible cells in a body row, use `colspan` to span the remaining columns rather than leaving them empty:

```html
<table>
  <thead>
    <tr>
      <th>Name</th>
      <th>Role</th>
      <th>Status</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Alice</td>
      <td colspan="2">Info unavailable</td>
    </tr>
  </tbody>
</table>
```

### Correct: Reducing `colspan` to match actual content

If the header doesn't truly need to span multiple columns, simply remove the `colspan`:

```html
<table>
  <thead>
    <tr>
      <th>The table header</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>The table body</td>
    </tr>
  </tbody>
</table>
```