Junior

Skill component

Explicit grids

Skill: CSS Grid

Your progress

0 of 4 completed

Save your progress

Log in to save your progress

Component level
Basic
Expected at career level
Junior

Expected ability

Define rows and columns. Place items with named areas and line numbers, and control their span. Align all grid items and individual items on both axes with justify-items, align-items, justify-self, and align-self.

Assessments

  1. CSS Grid #1 / Practice

    An introductory level on CSS Grid. Build LEGO silhouettes using grids.

    Not started

    Complete the level
    Start

  2. CSS Grid #2 / Practice

    Named grid areas. Build LEGO silhouettes with grid-template-areas and place bricks using area names.

    Not started

    Complete the level
    Start

  3. CSS Grid #3 / Practice

    Item coordinates. Explore simple coordinates, line ranges, and span on a variety of LEGO grids.

    Not started

    Complete the level
    Start

  4. CSS Grid #4 / Practice

    justify-items, align-items, justify-self, and align-self; the values start, end, center, and stretch; alignment on both axes.

    Not started

    Complete the level
    Start