Style the first child — practice exercise

What you'll be asked to do

1. 1.Style the first childexercise · easy · 10 min

   Make the first .card red using :first-child.

   Passes when: Make the first .card red using :first-child.

2. 2.Style by positionexercise · easy · 10 min · practice plan

   Use :nth-child(1) to target the first card.

   Passes when: Use :nth-child(1) to target the first card.

3. 3.Exclude with :not()exercise · easy · 10 min · practice plan

   Colour every div that is not #one blue.

   Passes when: Colour every div that is not #one blue.

4. 4.Style the first of a typeexercise · easy · 10 min · practice plan

   Target the first paragraph inside #one.

   Passes when: Target the first paragraph inside #one.

5. 5.Combine two pseudo-classesexercise · medium · 10 min · practice plan

   Target the first child that is not a paragraph.

   Passes when: Target the first child that is not a paragraph.

6. 6.Fix the single colon countbug fix · easy · 8 min

   Pseudo-classes use one colon, but this one is misspelled.

   Passes when: Pseudo-classes use one colon, but this one is misspelled.

7. 7.Fix the zero-based indexbug fix · easy · 8 min · practice plan

   :nth-child() counts from 1, not 0.

   Passes when: :nth-child() counts from 1, not 0.

8. 8.Fix the inverted :not()bug fix · easy · 8 min · practice plan

   This excludes the wrong element.

   Passes when: This excludes the wrong element.

9. 9.Fix the wrong element targetedbug fix · easy · 8 min · practice plan

   The rule picks the span; the first paragraph was intended.

   Passes when: The rule picks the span; the first paragraph was intended.

10. 10.Fix the double colonbug fix · easy · 8 min · practice plan

    A double colon marks a pseudo-element, not a pseudo-class.

    Passes when: A double colon marks a pseudo-element, not a pseudo-class.

Between them these tasks cover :first-child, :nth-child and :not().

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