Programación 1 free lessons
Modern CSS — Flexbox and Grid
Design professional, responsive layouts with modern CSS.
Rated 3.7 to 4.8 out of 5 · survey of 600 students
M
Created by
Guías Team
What you'll learn
Flexbox: aligning and distributing elements in one dimension
CSS Grid: complex two-dimensional layouts
When to use Flexbox and when to use Grid
Media queries and real responsive design
Building a professional landing page layout
Course content · 12 lessons
1
Flexbox in 15 minutes — your first flexible layout
15 minFree
display: flex — the container
8 min
justify-content and align-items
10 min
flex-direction and flex-wrap
8 min
flex-grow, flex-shrink and flex-basis
11 min
Real Flexbox cases — navbar and cards
12 min
Introduction to CSS Grid
10 min
grid-template-columns and grid-template-rows
12 min
grid-gap and grid areas
11 min
Grid vs Flexbox — when to use each
9 min
Media queries and responsive design
12 min
Final project — responsive landing page with Grid and Flexbox
22 min
Course details
Lessons12 lessons
Duration2h 20min
LevelBeginner
LanguageEspañol
AccessUnlimited
CertificateOn completion
Unlock everything with Pro
Access all lessons, up to 100 Guía interactions per day, and certificates for $9.99/mo.
View plans →Log in to leave a review