Let items grow — practice exercise

What you'll be asked to do

1. 1.Let items growexercise · easy · 10 min

   Give every item a flex-grow of 1.

   Passes when: Give every item a flex-grow of 1.

2. 2.Stop an item shrinkingexercise · easy · 10 min · practice plan

   Set flex-shrink to 0 on the items.

   Passes when: Set flex-shrink to 0 on the items.

3. 3.Set a flex basisexercise · easy · 10 min · practice plan

   Give items a 120px basis.

   Passes when: Give items a 120px basis.

4. 4.Reorder an itemexercise · easy · 10 min · practice plan

   Give the items an order of 2.

   Passes when: Give the items an order of 2.

5. 5.Align one item differentlyexercise · medium · 10 min · practice plan

   Use align-self to push the items to the end.

   Passes when: Use align-self to push the items to the end.

6. 6.Fix flex-grow spelled wrongbug fix · easy · 8 min

   The property is flex-grow.

   Passes when: The property is flex-grow.

7. 7.Fix grow used where shrink was meantbug fix · easy · 8 min · practice plan

   Preventing shrinkage uses flex-shrink: 0.

   Passes when: Preventing shrinkage uses flex-shrink: 0.

8. 8.Fix the missing unit on the basisbug fix · easy · 8 min · practice plan

   flex-basis needs a unit.

   Passes when: flex-basis needs a unit.

9. 9.Fix align-items used on an itembug fix · easy · 8 min · practice plan

   An individual item uses align-self.

   Passes when: An individual item uses align-self.

10. 10.Fix the order set on the containerbug fix · easy · 8 min · practice plan

    order applies to flex items, not the container.

    Passes when: order applies to flex items, not the container.

Between them these tasks cover flex-grow, flex-shrink, order and align-self.

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