Start learning free

LESSON 8 OF 161 · FRONTEND: HTML

A Table

Practice

Some information has two sides: each day has its hours, each product has its price. Data like that, in rows and columns, goes in a table. Each row is a tr (table row). Inside a row go its cells: a th is a header cell that names its column, and a td is a data cell.

Here is a small price table, with a header row and two rows of data:

<table>
  <tr>
    <th>Product</th>
    <th>Price</th>
  </tr>
  <tr>
    <td>Pen</td>
    <td>$2</td>
  </tr>
  <tr>
    <td>Mug</td>
    <td>$12</td>
  </tr>
</table>

The cells of a row go in the order of the headers: the first cell sits under the first header. Use tables for data only, never to place things side by side on the page. A screen reader reads a table cell by cell, with the name of each cell's column.

The check prints each row with its cells in order, joined by |. Under the Opening hours heading, your page must print:

heading 2: Opening hours
table
  row: Day | Hours
  row: Mon–Fri | 9–18
  row: Saturday | 10–16
  row: Sunday | Closed
link: How we deliver -> https://example.com/delivery

Your task: under the Opening hours heading, add a table with a header row of th cells, Day and Hours, and three rows of td cells: Mon–Fri and 9–18, Saturday and 10–16, Sunday and Closed.


Assignment
Follow the Coding Tutorial to build the opening hours table, one row at a time.


Hint
Every cell goes inside a tr, and every tr inside the table. Type each row empty first, then fill it with its two cells, the day first.


STEP 1 OF 9
    Ctrl + Enter to check