Students Save 30%! Learn & create with unlimited courses & creative assets Students Save 30%! Save Now
by
Lessons:7Length:53 minutes

Next lesson playing in 5 seconds

Cancel

1.2 What Is CSS Grid Layout (a.k.a. Grid)?

Grid Layout is a new and powerful CSS layout system. It divides areas on a web page into rows and columns and then lets you position elements anywhere you want within that grid.

What’s really nice about it is the fact that the positioning is done via CSS, not HTML. So if at some point you decide to change an element’s position, you can keep the existing markup and make your changes in CSS.

This also lends itself very well to creating responsive webpages. Because you’re doing all the positioning in CSS, you can use media queries to move elements around at different screen sizes—something that was very difficult to do (if not impossible) using old layout methods.

Let’s begin by looking at a layout built with Grid.

Related Links