C4: Session 6

CSS Grid

CSS Grid

CSS Grid

Grid is another layout framework in CSS similar to flexbox

CSS Grid

Grid Container Properties

• display
• grid-template-columns
• grid-template-rows
• row-gap
• column-gap

CSS Grid

CSS Grid

Grid Areas

You can also use grid-template-areas to specify areas in your grid like a blueprint!

CSS Grid

Next Session

Combining Grid and Flexbox

Media Queries