Make the child a grid — practice exercise

What you'll be asked to do

1. 1.Make the child a gridexercise · easy · 10 min

   Turn .cell into its own grid container.

   Passes when: Turn .cell into its own grid container.

2. 2.Inherit the parent columnsexercise · easy · 10 min · practice plan

   Use subgrid so .cell reuses the parent's column tracks.

   Passes when: Use subgrid so .cell reuses the parent's column tracks.

3. 3.Span the parent tracksexercise · easy · 10 min · practice plan

   Make .cell span both parent columns.

   Passes when: Make .cell span both parent columns.

4. 4.Subgrid the rowsexercise · easy · 10 min · practice plan

   Use subgrid on the row axis.

   Passes when: Use subgrid on the row axis.

5. 5.Subgrid with a gapexercise · medium · 10 min · practice plan

   Subgrid the columns and add a 10px gap inside.

   Passes when: Subgrid the columns and add a 10px gap inside.

6. 6.Fix the missing nested gridbug fix · easy · 8 min

   subgrid only works on a grid container.

   Passes when: subgrid only works on a grid container.

7. 7.Fix the misspelled keywordbug fix · easy · 8 min · practice plan

   The value is subgrid, not sub-grid.

   Passes when: The value is subgrid, not sub-grid.

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

   The subgrid was declared on columns but rows were intended.

   Passes when: The subgrid was declared on columns but rows were intended.

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

   A subgrid must span the parent tracks it inherits.

   Passes when: A subgrid must span the parent tracks it inherits.

10. 10.Fix the gap on the wrong elementbug fix · easy · 8 min · practice plan

    The inner gap belongs on the subgrid container.

    Passes when: The inner gap belongs on the subgrid container.

Between them these tasks cover subgrid, Nested grids and Track inheritance.

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