Week 3: CSS Layouts

Learning Objectives: By the end of this week, you will understand CSS Flexbox and Grid layouts, when to use each, and how to build responsive page layouts.

Sessions

Session 1: CSS Flexbox

Flex containers, items, axes, and common layout patterns

Session 2: CSS Grid

Two-dimensional layouts with rows and columns, fr units, grid areas, and responsive patterns

Topics Covered

CSS Flexbox fundamentals
Flex container and item properties
CSS Grid fundamentals
Grid container and item properties
When to use Flexbox vs Grid
Building responsive layouts