Skip to main content

Text Wrapping — exercises and bug fixes

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

    Stop the text wrapping

    easy10 min

    Keep #text on a single line.

  2. 2

    Break long words

    easy10 min

    Let long words in #text break rather than overflow.

  3. 3

    Preserve whitespace

    easy10 min

    Keep the whitespace in #text but still wrap lines.

  4. 4

    Balance the heading

    easy10 min

    Even out the line lengths of #title.

  5. 5

    Truncate with an ellipsis

    medium10 min

    One line, hidden overflow, and a trailing ellipsis.

Find the bug(5)

  1. 1

    Fix the hyphenated value

    easy8 min

    The value is nowrap, written as one word.

  2. 2

    Fix the wrong break value

    easy8 min

    This should break only when a word would overflow.

  3. 3

    Fix pre used where pre-wrap was meant

    easy8 min

    Whitespace should be kept, but lines should still wrap.

  4. 4

    Fix the wrap value

    easy8 min

    Evening out line lengths uses balance, not pretty.

  5. 5

    Fix the ellipsis that never shows

    easy8 min

    text-overflow needs hidden overflow and no wrapping.

Ready to write the code?

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

Open the workspace