CSS Grid For Beginners – Simple and Ezy

Learn how to use CSS Grid to build a perfect website, placing containers anywhere with the least effort

This is a beginners course, (which gives a little more…merging into an intermediate level) that will teach you how to use CSS grid to build responsive websites without breaking a sweat. You will learn how to setup CSS Grid columns and rows, You will learn about Grid Areas to move divs and other containers around on your web page.  Do you want to use CSS Grid to build a responsive website? Of course you do. You will see how ezy it is to do this by combining Grid Areas with media queries. But wait, there’s more! Learn about nested CSS Grids, Grid Lines, aligning and justifying containers and finally – a bonus video at the end of the course that teaches you how to use the developer tools provided by Google Chrome and Mozilla Firefox to help you visualize the CSS Grid.

What you’ll learn

  • CSS Grid Code.

Course Content

  • Introduction –> 1 lecture • 4min.
  • Adding columns and rows to your web page. –> 2 lectures • 25min.
  • Grid Areas and Media Queries –> 2 lectures • 21min.
  • Further goodies for the perfect website –> 3 lectures • 37min.
  • All Good Things… –> 1 lecture • 8min.

CSS Grid For Beginners - Simple and Ezy

Requirements

  • Basic knowledge of HTML and CSS.

This is a beginners course, (which gives a little more…merging into an intermediate level) that will teach you how to use CSS grid to build responsive websites without breaking a sweat. You will learn how to setup CSS Grid columns and rows, You will learn about Grid Areas to move divs and other containers around on your web page.  Do you want to use CSS Grid to build a responsive website? Of course you do. You will see how ezy it is to do this by combining Grid Areas with media queries. But wait, there’s more! Learn about nested CSS Grids, Grid Lines, aligning and justifying containers and finally – a bonus video at the end of the course that teaches you how to use the developer tools provided by Google Chrome and Mozilla Firefox to help you visualize the CSS Grid.