CSS turns plain HTML into a real interface — layout, spacing, color, and typography, plus the responsive techniques that make a page work on any screen size. This module covers selectors and the box model first, then the two layout systems you'll use constantly: Flexbox and Grid.
By the end you'll be able to build a fully responsive layout from scratch. Work through these lessons in order, then move on to JavaScript to start making pages interactive.
How rules, selectors, and specificity decide which styles actually get applied to an element.
Content, padding, border, and margin: the model behind every element's size and spacing on the page.
Laying out and aligning items along a single axis — the go-to tool for navbars, cards, and rows of content.
Two-dimensional layout for full page structures, dashboards, and anything with rows and columns.
Building layouts that adapt across breakpoints, with a mobile-first approach to media queries.
Styling text and color systems, plus simple transitions and animations for a polished feel.
A written reference covering the module's properties and layout patterns — good for a quick lookup after watching the videos.
Article