Set a min-content minimum — practice exercise

What you'll be asked to do

1. 1.Set a min-content minimumexercise · easy · 10 min

   Give #box a min-width of min-content.

   Passes when: Give #box a min-width of min-content.

2. 2.Set a max-content maximumexercise · easy · 10 min · practice plan

   Give #box a max-width of max-content.

   Passes when: Give #box a max-width of max-content.

3. 3.Cap with fit-contentexercise · easy · 10 min · practice plan

   Give #box a max-width of fit-content.

   Passes when: Give #box a max-width of fit-content.

4. 4.Combine a minimum and a fixed widthexercise · easy · 10 min · practice plan

   200px wide but never below min-content.

   Passes when: 200px wide but never below min-content.

5. 5.Cap the height intrinsicallyexercise · medium · 10 min · practice plan

   Give #box a max-height of max-content.

   Passes when: Give #box a max-height of max-content.

6. 6.Fix the misspelled keywordbug fix · easy · 8 min

   The keyword is min-content.

   Passes when: The keyword is min-content.

7. 7.Fix min and max confusedbug fix · easy · 8 min · practice plan

   Capping the width uses max-width.

   Passes when: Capping the width uses max-width.

8. 8.Fix the fixed width that should be intrinsicbug fix · easy · 8 min · practice plan

   The cap should follow the content, not a hard number.

   Passes when: The cap should follow the content, not a hard number.

9. 9.Fix the missing minimumbug fix · easy · 8 min · practice plan

   The box needs a min-content floor as well as its width.

   Passes when: The box needs a min-content floor as well as its width.

10. 10.Fix the wrong axisbug fix · easy · 8 min · practice plan

    The intrinsic cap was applied to width instead of height.

    Passes when: The intrinsic cap was applied to width instead of height.

Between them these tasks cover min-content and max-content, fit-content and Intrinsic keywords.

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