Skip to main content

HTML Formatting — exercises and bug fixes

5 hands-on exercises and 5 find-the-bug challenges for the HTML Formatting 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 real importance with <strong>

    easy10 min

    Write a warning paragraph where the phrase "This action cannot be undone" is wrapped in <strong> — not just bold styling, but real importance a screen reader will announce.

    • Wrap the warning in <strong>.
    • Use the exact warning text.
  2. 2

    Add stress emphasis with <em>

    easy10 min

    Write the sentence "I said the meeting is at noon, not midnight." with the word "noon" wrapped in <em> to stress that specific word.

    • Wrap the stressed word in <em>.
    • Stress the word "noon".
  3. 3

    Use <b> for a keyword without extra importance

    easy10 min

    Write a spec line "Material: Bamboo" where the word "Bamboo" is wrapped in <b> — it should stand out visually as a keyword, without implying urgency or importance.

    • Wrap the keyword in <b>.
    • The keyword should be "Bamboo".
  4. 4

    Set off a foreign phrase with <i>

    easy10 min

    Write the sentence "The chef added a touch of umami to the broth." with the word "umami" wrapped in <i>, since it's a foreign-language term used in an alternate voice from the rest of the sentence.

    • Wrap the foreign term in <i>.
    • The term should be "umami".
  5. 5

    Combine importance and emphasis correctly

    medium15 min

    Write "Please arrive early." where the word "early" is both important and stressed — nest <em> inside <strong> around that one word.

    • Nest <em> inside <strong> around the word.
    • The nested word should be "early".

Find the bug(5)

  1. 1

    Fix the warning that isn't announced as important

    easy10 min

    This safety warning uses <b> for the critical phrase, so screen readers skip right over it. Change it to <strong> so it's announced as truly important.

    • Use <strong> for the warning.
    • Keep the exact warning text.
  2. 2

    Fix the sentence with the wrong stress tag

    easy10 min

    This sentence uses <i> on "noon", but the word needs stress emphasis, not just an alternate voice. Change it to <em>.

    • Use <em> to stress the word.
    • The stressed word should be "noon".
  3. 3

    Fix the keyword with no formatting at all

    easy10 min

    The spec line has plain text where the material name should stand out. Wrap "Bamboo" in <b> so it reads as a keyword.

    • Wrap the keyword in <b>.
    • The keyword should be "Bamboo".
  4. 4

    Fix the foreign term using the wrong tag

    easy10 min

    This sentence stresses "umami" with <em>, but it's a foreign-language term in an alternate voice, not a word needing stress. Change it to <i>.

    • Use <i> for the foreign term.
    • The term should be "umami".
  5. 5

    Fix the emphasis that lost its meaning

    medium15 min

    This nests <b> inside <strong>, so the word is bold twice but never actually stressed. Change the inner tag to <em> so it carries both importance and stress emphasis.

    • Nest <em> fully inside <strong>.
    • Keep the word inside the nested tags.

Ready to write the code?

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

Open the workspace