Skip to main content

CSS Tables — exercises and bug fixes

5 hands-on exercises and 5 find-the-bug challenges for the CSS Tables lesson. Every one is checked automatically in the browser — write the code, run it, and the tests tell you what still fails.

Exercises(5)

  1. 1

    Collapse the borders

    easy10 min

    Merge the cell borders of #table into single lines.

  2. 2

    Space the cells

    easy10 min

    Keep separate borders and space them 4px apart.

  3. 3

    Move the caption

    easy10 min

    Put the caption below the table.

  4. 4

    Use a fixed layout

    easy10 min

    Make column widths ignore the content.

  5. 5

    Style the cells

    medium10 min

    Collapsed borders with 8px padding and left-aligned headers.

Find the bug(5)

  1. 1

    Fix the invalid value

    easy8 min

    The value is collapse, not collapsed.

  2. 2

    Fix the spacing that never applies

    easy8 min

    border-spacing is ignored when borders are collapsed.

  3. 3

    Fix the caption property

    easy8 min

    The property is caption-side.

  4. 4

    Fix the layout value

    easy8 min

    Ignoring content widths uses table-layout: fixed.

  5. 5

    Fix the padding on the table

    easy8 min

    Cell padding belongs on the cells, not the table.

Ready to write the code?

The editor, the automatic checks and the worked solutions open up with an account.

Open the workspace