Skip to main content

HTML Styles — exercises and bug fixes

5 hands-on exercises and 5 find-the-bug challenges for the HTML Styles 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

    Add an inline style

    easy10 min

    Give a paragraph a red colour using the style attribute.

  2. 2

    Add a class

    easy10 min

    Give a paragraph the class "lead".

  3. 3

    Add an id

    easy10 min

    Give a section the id "main".

  4. 4

    Combine class and style

    easy10 min

    Give a div both a class of "box" and an inline background.

  5. 5

    Style two elements with one class

    medium10 min

    Give two paragraphs the same class "note".

Find the bug(5)

  1. 1

    Fix the wrong attribute name

    easy8 min

    "styles" is not a real attribute.

  2. 2

    Fix the class written as a selector

    easy8 min

    The class value should not include the dot.

  3. 3

    Fix the id written with a hash

    easy8 min

    The id value should not include the #.

  4. 4

    Fix the extra class

    easy8 min

    A stray second class was left on the element.

  5. 5

    Fix the duplicated class attribute

    easy8 min

    The element has two class attributes; only the first counts.

Ready to write the code?

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

Open the workspace