Digital Academyby FSG
← All courses
Starter plan

CSS

Take the profile page you structured in HTML and make it something people want to look at: colors, spacing, real layouts with flexbox and grid, typography with taste — and a responsive design that works from a 360px phone to a wide desktop.

5 modules · 17 lessons · one at a time, in order

See plans

Course outline

5 modules · 17 lessons — taken one at a time, in order.

Module 1

Making things look like something

4 lessons · 1 assignment
  1. 1What CSS is and three ways to add it
  2. 2Selectors
  3. 3Color & units
  4. 4The cascade, in plain language
  5. ✎Style an unstyled pageAI-graded
Module 2

The box model

3 lessons · 1 assignment
  1. 1Everything is a box
  2. 2Display: block, inline, inline-block
  3. 3Debugging layout with dev tools
  4. ✎Recreate a card designAI-graded
Module 3

Layout

4 lessons · 1 assignment
  1. 1Flexbox I: the row
  2. 2Flexbox II: wrapping & growing
  3. 3Grid, the introduction
  4. 4Classic patterns
  5. ✎Lay out a landing pageAI-graded
Module 4

Typography & polish

3 lessons · 1 assignment
  1. 1Web typography
  2. 2States & transitions
  3. 3Custom properties
  4. ✎Typography & polish pass on your profile pageAI-graded
Module 5

Responsive design

3 lessons · 1 assignment
  1. 1Why mobile-first
  2. 2Media queries
  3. 3Responsive patterns
  4. ✎Make your profile page fully responsiveAI-graded