Skip to main content

CSS Font Size — exercises and bug fixes

5 hands-on exercises and 5 find-the-bug challenges for the CSS Font Size 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

    Set a pixel size

    easy10 min

    Make #text 24px.

  2. 2

    Size a heading

    easy10 min

    Make #title 32px.

  3. 3

    Use rem

    easy10 min

    With a 16px root, set #text to 1.5rem.

  4. 4

    Use em

    easy10 min

    With #wrap at 20px, set #text to 1.5em.

  5. 5

    Build a type scale

    medium10 min

    32px heading over 16px body text.

Find the bug(5)

  1. 1

    Fix the missing unit

    easy8 min

    A font size needs a unit.

  2. 2

    Fix the shortened property

    easy8 min

    The property is font-size.

  3. 3

    Fix rem confused with em

    easy8 min

    1.5rem against a 16px root should be 24px.

  4. 4

    Fix the wrong root size

    easy8 min

    The root should be 16px so 1.5rem lands on 24px.

  5. 5

    Fix the inverted scale

    easy8 min

    The heading should be larger than the body text.

Ready to write the code?

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

Open the workspace