Table Cell (td)

The <td> element (table data) holds a single regular data cell within a row — the actual value, as opposed to a header label.

Syntax

<tr>
    <td>cell content</td>
</tr>

Basic Example

<tr>
    <td>Aman</td>
    <td>92</td>
    <td>88</td>
</tr>

Browser output: three plain, left-aligned cells by default — no bold styling, unlike header cells.

How It Works

<td> is a generic cell — it can hold plain text, numbers, links, images, or even nested elements like a small list, though most table cells hold simple values.

Important Attributes

Real-World Example

<tr>
    <td>MERN Full Stack</td>
    <td><a href="/cources/MERN_Stack.php">View Details</a></td>
</tr>

Cells aren't limited to plain text — here, one cell holds a real link, a common pattern in a course-comparison or pricing table.

Common Mistakes

• Using <td> for a cell that's actually acting as a header/label for its row or column — that should be <th> instead
• Leaving cells empty without at least a placeholder like "—" when a value genuinely doesn't apply, which can look like a rendering bug

Best Practices

• Use <th> for anything functioning as a label, and <td> only for the actual data values
• Keep cell content focused — one clear value or piece of data per cell

Accessibility Considerations

Correctly distinguishing <td> from <th> is what lets screen readers announce "Math: 92" instead of just reading two disconnected values with no relationship between them.

SEO Considerations

No direct effect beyond overall table structure quality.

Browser & Modern HTML Notes

Stable and simple; old presentational attributes like align, valign, and bgcolor on <td> are obsolete in favor of CSS text-align, vertical-align, and background-color.

Mini Practice

1. Build a row of 3 <td> cells containing a name, a number, and a link.
2. Identify which cells in a sample table should actually be <th> instead of <td>.

Related HTML Notes

• table-header
• colspan
• rowspan