css dojo(re)learn CSS, the right way

Why CSS Sometimes Sucks

Can you predict with 100% confidence what will be the visual result of the following code?

CSS can be frustrating because it relies on rules and concepts we usually don’t learn and practice.
Not knowing those concepts makes CSS code unpredictable and it can annoy the hell out of anyone.

This website teaches you those concepts, allowing you to face any CSS issue with confidence. Straight to the point, information-packed katas (= exercises), will lay a strong theoretical base and put those new skills to practice with live code editors.

You want to improve your CSS skills? Read and practice the katas in order. 100% of the content is useful.

You want to master CSS? Try to explain every concept in this skills list to someone else. If you succeed in making it crystal clear, you truly have mastered CSS.

Basics

How to style the UI elements themselves.

  1. Introduction to CSS and How the browser renders the page
  2. Selectors and Specificity
  3. CSS units and variables
  4. Styling text and custom fonts
  5. The Box Model and Layouts
  6. The Flow layout

Layouts

How to arrange the UI elements between each other.

  1. Position and z-index
  2. Overflowing content
  3. The Flex layout
  4. The Grid layout
  5. The Table layout
  6. Media queries

Advanced CSS

Although this part will use some Javascript, no previous knowledge of frameworks such as React is required.

  1. Animations
  2. CSS-in-JS
  3. Best practices and Stylelint
  4. How to choose your CSS tooling
  5. How to refactor legacy CSS

Sponsors

Theodo