- codrops – An extensive CSS reference offering way more content than MDN.
- Can I use – Interactive browser support tables for CSS (and HTML5).
CSS in a nutshell
- Introduction to CSS – This screencast series will teach you the basics of CSS in about one hour.
- The cascade – This article explains what the cascade is and how this affects you.
- Specificity and inheritance – Understanding specificity and inheritance is important to master CSS. This article will help.
- CSS Box Model – An article explaining the foundation of layout on the web.
- Responsive Design – Extensive information about all aspects of responsive design to make sites that look great and work well for everyone.
- Basic CSS Selectors – An introduction to the very basic CSS selectors you need to know.
- Advanced CSS Selectors – Level up your knowledge. From attribute selectors to CSS3 pseudo classes.
- CSS Diner – Learn how to use CSS selectors with this fun little game.
Custom properties (aka CSS variables)
- Floats – In depth information about how to use (and clear) floats.
- Positioning Types – A closer look at a few little-known things related to the CSS positioning layout method.
- inline-block – Shows in which cases it makes sense to use the display property
inline-block for layouting.
- Flexbox playground – Play with Flexbox examples on CodePen.
- Flexbox Defense – A tower defense game in the browser to learn about Flexbox with fun.
- Flexbox Froggy – Learn all the basics of Flexbox with a fun game involving frogs and lily pads.
- Flexbugs – Community-curated list of flexbox issues and cross-browser workarounds for them.
- Flexbox Zombies – A training course driven by a storyline where you use Flexbox and a crossbow to hunt zombies.
- What the Flexbox? – A simple, free 20 video course that will help you master CSS Flexbox!
- A Complete Guide to Grid – All you need to know about CSS Grid Layout on one page.
- Grid by Example – Besides examples of how to use Grid, this site also has additional useful learning resources.
- Designing with Grid – Talk about the new layout possibilities CSS Grid is offering.
- Grid Garden – Lovely game where you write CSS code to grow your carrot garden.
- GridBugs – Community-curated list of Grid interop issues and workarounds for them.
- Grid Critters – Learn CSS grid layout by mastering an adventure game.
- CSS Grid – Learn CSS grid with Wes Bos – Free 4 hours video course, 25 Videos.
Image Credits – A shoutout to Multi Awesome Studio on Unsplash