A high level introduction to the new CSS Grid Layout specification. Learn about the key features and see cool some examples to show you what's possible with Grid.

Learn how to place individual items on the grid using CSS Grid Layout. This opens the possibility of creating truly dynamic grid layouts by placing items where you want them.

Learn how to align the grid and all of the individual items in the grid using CSS Grid Layout. This powerful feature allows for variation within each grid item.

The auto-flow feature in CSS Grid allows you to determine the order in which the rows and columns are laid out. Useful for laying out content in sequential order.

CSS Grid allows you to create large areas where you can specifically place nested grids or other items. Learn how to create regions or areas on your grid.

The first video in the series introduces the project and shows the layout that we want to achieve using CSS Grid Layout.

In the second video, see how the entire website can be set up using CSS Grid Layout. Learn how to think through laying out a website using Grid.

The third video in this series will teach you how to create a responsive header and navigation using CSS Flexbox. Flexbox is a great compliment to CSS Grid Layout.

In this video, you'll learn how to create a hero image with text overlay, again using CSS Flexbox. We'll also look at creating background images in CSS.

In video 5 of this series, you'll create a features section using a nested CSS Grid. The features section highlights three items or posts.

This video shows you how to create a featured text box that displays a call to action or callout text. Again we use background images and Flexbox.

The seventh video shows you how to create a front page blog or news section using a nested CSS Grid Layout. This media section also includes links to read more.

In this video you'll learn how to set up an Apple-style footer using CSS Grid Layout. The links are used for internal or external links to improve user experience.

The final video of the series looks at making sure the design is fully responsive. You'll utilize media queries to create a website that looks good on any device.