The editable workshop

Fix this page.

Three small repairs. Your code. A result you can see.

Read the goal, change the HTML or CSS, then update the preview and check your repair. Hints reveal one step at a time. The checks cover each stated goal, not every aspect of a finished website.

Keep the card inside

Repair a card that is wider than its container.

Edit · Preview · Check →02

Style the right message

Find why the highlighted message keeps the wrong colour.

Edit · Preview · Check →03

Give the field a name

Connect a visible label to a form field.

Edit · Preview · Check →

New to debugging? Start with the guided bug exercises →