An awesome list limited to the best CSS learning resources
This list is mainly about CSS – the language and the modules. Not about naming conventions, architecture paradigms, frameworks, pre-processors, post-processors or other aspects of todays CSS ecosystem.
Please read the contribution guidelines before contributing.
- CSS References
- Fundamental concepts
- CSS units
- Selectors
- Custom properties (aka CSS variables)
- Layout
- Secificity and inheritance - Understanding specificity, inheritance and is important to master CSS. This article will help.
- The Lengths of CSS - Overview covering absolute and relative units.
- Fun with Viewport Units - Imparts the basics and shows some nifty use-cases.
- CSS Dinner - Learn how to use CSS selectors with this fun little game.
- Could need a link about advanced CSS Selectors.
- Section could need a link or two.
- Layout Land - Jen Simmons video series about the new CSS Layout possibilities.
- A Complete Guide to Flexbox - All you need to know about Flexbox on one page.
- 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.
- 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 ressources.
To the extent possible under law, Michael Kühnel has waived all copyright and related or neighboring rights to this work.