Mastery of Flexbox and CSS Grid - The Modern Practical Guide

Udemy Mastery of Flexbox and CSS Grid - The Modern Practical Guide

Register & Get access to index
4655746-c56d-2.jpg



Build Modern and Responsive Front-End Web Layouts using CSS Flexbox, CSS Grid and HTML, CSS. Master Flexbox and Grid
4.5 | (2 ratings) | 27 students | Author: Pamch Tutor
Course Duration:


25 sections • 150 lectures • 30h 4m total length




What you'll learn:

  • You will learn how to create various layout styles with CSS Grid and Flexbox
  • You will be able to create grid layouts using grid-template-areas
  • You will learn how to create equal and unequal columns/rows using both CSS Grid and Flexbox
  • You will be skilled on how to design MASONRY layout with flex and grid
  • You will learn how to use the fractional unit (fr) in CSS Grid
  • You will master how to create flex layouts with flex-basis
  • You will be skilled on how to work with implicit grid and explicit grid
  • You will learn how to use the CSS Media Query to make your web design mobile friendly and responsive.
  • You will learn how to create image gallery and video gallery with CSS Grid and Flexbox
  • You will be able to align and justify grid items and flex items
  • You will learn the difference between auto-fill & auto-fit in Grid
  • You will master how to use arbitrary grid line names in Grid
  • You will be able to work with ALL flexbox properties and ALL Grid properties step by step
  • You will creatively create the same web layout using flexbox and using grid


Requirements:

  • You will need a basic text editor which are free for us - e.g. sublime text, visual studio code, brackets
  • You should have understanding of how to code with basic CSS and HTML


Description:



This course is designed to make you a world class front-end web designer with CSS Grid and Flexbox as your tool. With the skills you will gather from this course, you can proudly create any website layout design from start to finish. It is an assurance because this Flexbox and CSS Grid course is modern, premium, adequately explained and well structured.What you will learn.You will be able to work with ALL flexbox properties and ALL Grid properties step by stepYou will learn how to create various layout designs with CSS Grid and FlexboxYou will learn how to use the fractional unit (fr) in CSS GridYou will be able to create responsive grid layouts using grid-template-areasYou will be skilled on how to design masonry layout with flex and gridYou will be skilled on how to work with implicit grid and explicit gridYou will learn the difference between auto-fill & auto-fit in GridYou will be able to align and justify grid items and flex itemsYou will learn how to create image gallery and video gallery with CSS Grid and FlexboxYou will learn how to create equal and unequal columns/rows using both CSS Grid and FlexboxYou will master how to use arbitrary grid line names in GridYou will be able to create navigation menus and mega menus. You will learn how to add images and videos to mega menusYou will be creative with how to use the CSS Media Query to make your web design mobile friendly and responsive. This means mobile-first approach.You will learn how to import font awesome in order to incorporate it in your designYou will thoroughly learn how to import Google fonts as part of your font familyYou will be able to apply some CSS properties to your layout design such as margin, padding, position, border properties, etc.


Who this course is for:

  • This flexbox and grid course is for those who intend to be an expert in the craft of flexbox and CSS Grid layouts from absolute beginner to absolute professional
  • Creative minds who has a basic knowledge of pure CSS
Author
Satoru Gojo
Downloads
191
Views
1,931
First release
Last update
Rating
5.00 star(s) 1 ratings

More resources from Satoru Gojo

Latest reviews

Great Thanks!