Set a pixel size — practice exercise

What you'll be asked to do

1. 1.Set a pixel sizeexercise · easy · 10 min

   Make #text 24px.

   Passes when: Make #text 24px.

2. 2.Size a headingexercise · easy · 10 min · practice plan

   Make #title 32px.

   Passes when: Make #title 32px.

3. 3.Use remexercise · easy · 10 min · practice plan

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

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

4. 4.Use emexercise · easy · 10 min · practice plan

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

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

5. 5.Build a type scaleexercise · medium · 10 min · practice plan

   32px heading over 16px body text.

   Passes when: 32px heading over 16px body text.

6. 6.Fix the missing unitbug fix · easy · 8 min

   A font size needs a unit.

   Passes when: A font size needs a unit.

7. 7.Fix the shortened propertybug fix · easy · 8 min · practice plan

   The property is font-size.

   Passes when: The property is font-size.

8. 8.Fix rem confused with embug fix · easy · 8 min · practice plan

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

   Passes when: 1.5rem against a 16px root should be 24px.

9. 9.Fix the wrong root sizebug fix · easy · 8 min · practice plan

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

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

10. 10.Fix the inverted scalebug fix · easy · 8 min · practice plan

    The heading should be larger than the body text.

    Passes when: The heading should be larger than the body text.

Between them these tasks cover Absolute sizes, rem and em and Relative scaling.

Looking for a different chapter? See every practice set, or switch to the interview theory questions.