devnotes.

Building a Basic Table

Tables display data in rows and columns using <table>, <tr> (table row), and <td> (table data/cell).

<table>
  <tr>
    <td>Name</td>
    <td>Score</td>
  </tr>
  <tr>
    <td>Rahim</td>
    <td>85</td>
  </tr>
  <tr>
    <td>Karim</td>
    <td>92</td>
  </tr>
</table>

This produces a 3-row, 2-column grid. Notice that <tr> contains <td> elements — the row wraps the cells, not the other way around.

A critical rule: tables are for tabular data, not page layout. In the early 2000s, developers commonly used tables to lay out entire pages (navigation in one cell, content in another). This is now considered bad practice — CSS (specifically Flexbox and Grid) should handle layout, while <table> should be reserved for genuinely tabular data like schedules, price comparisons, or spreadsheets.

A quick test: if the data would make sense read aloud row-by-row by a screen reader ("Rahim, 85. Karim, 92."), it's a good candidate for a table. If you're just trying to position boxes on a page, use CSS instead.