Skip to main content

HTML Block vs Inline Elements — exercises and bug fixes

5 hands-on exercises and 5 find-the-bug challenges for the HTML Block vs Inline Elements 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

    Use a block element

    easy10 min

    Add a div containing a paragraph.

  2. 2

    Use an inline element

    easy10 min

    Highlight a word inside a paragraph with a span.

  3. 3

    Nest inline inside block

    easy10 min

    Put a strong element inside a paragraph.

  4. 4

    Use a list as a block

    easy10 min

    Add a ul with two items.

  5. 5

    Combine block and inline

    medium10 min

    Add a section with a paragraph containing a link.

Find the bug(5)

  1. 1

    Fix the block inside a paragraph

    easy8 min

    A div cannot live inside a paragraph.

  2. 2

    Fix the span used as a container

    easy8 min

    A layout wrapper should be a block element.

  3. 3

    Fix the div used for emphasis

    easy8 min

    Inline emphasis belongs in a span or strong.

  4. 4

    Fix the list items in a div

    easy8 min

    List items need a real list parent.

  5. 5

    Fix the link wrapping a section

    easy8 min

    Keep the link inline inside the paragraph.

Ready to write the code?

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

Open the workspace