CSS by Numbers is a project to act as one possible answer the question "how do you learn CSS"
Specifically, what if you're already a developer, maybe even work with a design system like bootstrap and so have never really needed to understand what CSS is happening behind the scenes. Maybe you already understand the basics of what's going on, but most CSS courses start as if you are new to coding entirely.
CSS By Numbers attempts to come at this question from a different direction than starting from the ground up. Sure, we'll still be talking about the fundamentals, but rather than looking at them in an isolated tutorial, we can look at something more real-world by creating a semi-realistic design from a real designer.
How would we create this horizontal menu layout? What about the hero image with a call to action button, or an author bio with a rounded avatar?
The idea is to utilise the format popularised with incredible games like like https://flexboxfroggy.com/ or https://cssgridgarden.com/ and let you write CSS until you've matched the design.
You can skip to the end, you can fast forward to the bit you care about, but line by line, number by number, we'll step through the CSS we need to write and discuss what it does.
Design contributions to add to the series are also very welcome, please open an issue with a screenshot of the proposed design. Images should be sourced from Unsplash, and fonts should be Google Fonts or a similar source that allows free-use embedding.
Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.