Mastery of Flexbox and CSS Grid - The Modern Practical Guide

Build Modern and Responsive Front-End Web Layouts using CSS Flexbox, CSS Grid and HTML, CSS. Master Flexbox and Grid


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 step
You will learn how to create various
layout designs
with
CSS Grid and Flexbox
You will learn how to use the
fractional unit (fr)
in CSS Grid
You will be able to create
responsive

grid layouts
using
grid-template-areas
You will be skilled on how to design
masonry layout
with
flex
and
grid
You will be skilled on how to work with
implicit grid and explicit grid
You will learn the difference between
auto-fill
&
auto-fit
in Grid
You will be able to
align
and
justify

grid items
and
flex items
You will learn how to
create image gallery and video gallery
with
CSS Grid and Flexbox
You will learn how to
create equal and unequal columns/rows
using both
CSS Grid and Flexbox
You will master how to use
arbitrary grid line names
in Grid
You will be able to
create navigation menus
and
mega menus.
You will learn how to
add images and videos to mega menus
You 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 design
You will thoroughly learn how to
import Google fonts
as part of your font family
You 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

More Info