Skip to main content

HTML Paragraphs — exercises and bug fixes

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

    Write three separate paragraphs

    easy10 min

    Break this block of text into three separate <p> elements, one per idea.

  2. 2

    Break a line inside a paragraph

    easy10 min

    Write a paragraph containing a mailing address on two lines, using <br> to force the line break without starting a new paragraph.

  3. 3

    Separate sections with a thematic break

    easy10 min

    Add an <hr> between the two paragraphs below to mark a change of topic.

  4. 4

    Preserve formatting with <pre>

    easy10 min

    Show the code snippet "const x = 1;" exactly as written, preserving its spacing, using a <pre> element.

    • Add a <pre> element.
    • Include the exact code snippet.
  5. 5

    Lead with a strong opening word

    medium15 min

    Write a paragraph that starts with the word "Note:" wrapped in <strong>, followed by the rest of the sentence: "check your work before submitting."

    • Wrap the sentence in a paragraph.
    • Wrap "Note:" in <strong>.
    • Include the rest of the sentence.

Find the bug(5)

  1. 1

    Fix the single wall of text

    easy10 min

    Everything is crammed into one paragraph. Split it into three separate <p> elements, one per sentence.

  2. 2

    Fix the address squished onto one line

    easy10 min

    This address has no line break, so the street and city run together. Add a <br> so the city starts on its own line.

  3. 3

    Fix the missing thematic break

    easy10 min

    Add the <hr> that's missing between these two unrelated sections.

  4. 4

    Fix the code snippet that lost its formatting

    easy10 min

    This code snippet is in a plain <p>, so its spacing collapses. Move it into a <pre> element instead, keeping the exact text "const x = 1;".

    • Use a <pre> element for the code.
    • Keep the exact code text.
  5. 5

    Fix the wrong reminder text

    medium15 min

    The reminder paragraph has the wrong wording. Fix the sentence after "Note:" to read exactly "check your work before submitting."

Ready to write the code?

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

Open the workspace