Skip to main content

Table Styling & Borders — exercises and bug fixes

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

Sign in to start solvingCreate a free account

Exercises(5)

  1. 1

    Mark a row header scope

    easy10 min

    Add scope="col" to the header cell.

  2. 2

    Mark a row-scope header

    easy10 min

    Add a th with scope="row".

  3. 3

    Add a styled table class

    easy10 min

    Give the table the class "striped".

  4. 4

    Group columns

    easy10 min

    Add a colgroup with one col element.

  5. 5

    Add a footer row

    medium10 min

    Use tfoot for a totals row.

Find the bug(5)

  1. 1

    Fix the missing scope

    easy8 min

    Header cells need a scope so screen readers can associate them.

  2. 2

    Fix the wrong scope value

    easy8 min

    A column header should use col, not column.

  3. 3

    Fix the deprecated border attribute

    easy8 min

    Use a class and CSS instead of the border attribute.

  4. 4

    Fix the missing column group

    easy8 min

    The table has no colgroup at all.

  5. 5

    Fix the footer marked as a body

    easy8 min

    The totals row should sit in tfoot.

Ready to write the code?

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

Open the workspace