Skip to Content
Learn
Advanced CSS Grid
Review

Great work! You have learned many new properties to use when creating a layout using CSS Grid! Let’s review:

  • grid-template-areas specifies grid named grid areas
  • grid layouts are two-dimensional: they have a row, or inline, axis and a column, or block, axis.
  • justify-items specifies how individual elements should spread across the row axis
  • justify-content specifies how groups of elements should spread across the row axis
  • justify-self specifies how a single element should position itself with respect to the row axis
  • align-items specifies how individual elements should spread across the column axis
  • align-content specifies how groups of elements should spread across the column axis
  • align-self specifies how a single element should position itself with respect to the column axis
  • grid-auto-rows specifies the height of rows added implicitly to the grid
  • grid-auto-columns specifies the width of columns added implicitly to the grid
  • grid-auto-flow specifies in which direction implicit elements should be created

This is a great time to experiment with the code in the code editor and try any of the properties you want to practice more! When you’re ready, move on!

Instructions

1.

This is a great time to experiment with the code in the text editor to visualize any of the properties covered in this lesson! Move on when you’re ready.

Folder Icon

Take this course for free

Already have an account?