Books you can read to learn CSS
In 2022, I set out with a goal to read some of the CSS books out there to see how it would be to learn CSS to a greater extend “bottom up”. Here is a review of each of them, so maybe you more easily can take a qualified choice of what books to read, if you are interested in taking the same approach.
“CSS: The Definitive Guide” by Erik A. Meyer and Estelle Weyl
This book can be really recommended, it is long, about a thousands pages long — but it teaches you CSS from the bottom and up, even including some of it’s interesting history! The chapters are greatly dividing the different CSS properties in a sensible way, explaining each CSS property throughly one at a time. “CSS: The Definitive Guide” can be found on Amazon from $28 (used).
With chapters like “Specificity and the Cascade”, “Animation” or “Grid Layout”, and at the end a great index, it is easy to search and find what you are looking for using the book. The book even has a humorous tone to it, making it at times even a bit funny to read. It is perhaps not the book you would read at one go, so I would recommend this book first and foremost to experienced CSS developers knowing what they want to learn more about. Also, a great convenience would be if the book was split into smaller pockets books. You feel a bit of a scientist almost when bringing a thousand pages big book under your arm to help solve a problem, when you know e.g. the “Animation” chapter is all you are going to need.
“CSS Pocket Reference” by Erik Meyer
I have not read this back-to-back, as it is more of a pocket book you can easily turn up things. It works as an alternative to MDN Web Docs to keep on your desk to switch things up and not always turn to your computer to look up some CSS property. I have always been a fan of books and the tactile feel it gives, so I enjoy using this at times. A big bonus is off course that is yet again the oh-so-famous and CSS important figure Eric Meyer that is the author. “The CSS Pocket Reference” can be found on Amazon for $8.83 (used).
Being an another O’Reilly product, it works as a great addition to the “CSS: The Definitive Guide”. One thing to have in mind though, is that off course it will get outdated and not have the latest specification included, but I would say that the CSS does not evolve that fast currently for it to be a problem. Also, it seems to get fairly often updated, being on it’s 5th edition currently.
“CSS Secrets: Better Solutions to Everyday Web Design Problems” by Lea Verou
I’ve always been a big fan of Lea (just take a look at this post), so of course I found her book “CSS Secrets: Better Solutions to Everyday Web Design Problems” really intriguing. Lea’s own words are that this book is suitable for “intermediate to advanced” CSS developers, which makes sense, because the book is a series of solutions to typical CSS challenges most web developers doing CSS have experienced, and gotten crazy about thinking: “why is the solution to this simple issue that comprehensive”? “CSS Secrets: Better Solutions to Everyday Web Design Problems” can be bought on Amazon for $2.93 (used).
The book includes 47 secrets that are grouped into seven chapters like “Backgrounds and Borders”, “Typography” and “Transitions and Animations”. There is also an overview of the different secrets grouped by CSS specification (like “CSS Animation” or “CSS Backgrounds & Borders Level 4”, including a link to each corresponding W3C spec). The secrets included are solutions to challenges like the ones listed below ⬇️, so I would definitely recommend this book if you find some of these intriguing:
- Striped backgrounds
- Simple pie charts
- Folded corner effect
- Zebra-striped text lines
- Ligatures
- Circular text
- Fluid background, fixed content
- Vertical centering
- Sticky footers
- How to get an animation along a circular path.
… to mention a few (of 47!) 😮💨
The fact that the book is simply written with HTML styled with CSS (4 700 lines of SCSS!), and also have its preface written by the yet again oh-so famous and already mentioned Eric Meyer, makes this book just perfect for CSS nerds 👍 It also includes CSS coding tips, and also some background information about the typical standard process behind the W3C specs, and explains the different CSS spec levels (CSS 1, CSS 2 etc.), which can also come in handy to know.
“CSS in Depth” by Keith J. Grant
This book surprised me, as I remembered thinking “if I was ever to teach a class about CSS, teaching students about CSS from the bottom up, this book would be an excellent choice” (which I would actually really enjoy I think, teaching 🙈). The book is a smaller and less comprehensive alternative to the “CSS: Definitive Guide”, closing in on “only” about 400 pages. “CSS in Depth” can be bough at Amazon from $23.77 (used).
The book groups its chapters into four parts. It starts with the part “Reviewing the fundamentals”, perfect for beginners, giving enough information to get you started and feel in control, without adding too much detail that would leave a beginner to CSS confused (I refer to those kind of details that you later on as a more experienced CSS developer would really enjoy knowing the intricacies of 😁). Then it continues with the part “Mastering Layout”, in which Grant among other things manages to make the flexbox layout actually understandable without too much details. The last two chapters are named “CSS at Scale”, and lastly, “Advanced Topics”.
Grant shares his knowledge generously from his career which he claims has been since the “very beginning” of CSS. The fact that he builds websites that includes the New York Stock Exchange website (2018), does not make it less impressive. The foreword is written by builder of CSS-Tricks and CodePen co-founder Chris Coyier, which is yet another quality mark that solidifies this book as a great option for CSS beginners, but actually also for seasoned CSS developers that finally wants to read more about how it actually works (both Grant’s and Coyier’s words).
Psst. Josh W. Comeau’s CSS for Javascript Developers Course
Just one last thing, I actually gave Josh W. Comeau’s CSS for Javascript Developers Course a go last year. I would recommend if you are one to learn through interactive tasks/challenges. I have to admit, I did not complete all the assignments by handing them in, so I did not complete the course the right way, so bear this in mind when reading my words about this course. But it is a great resource that I have no doubt will leave you with tons of CSS knowledge and experience. I’m greatly impressed (and in awe) by Comeau for making this! 🙌 😊
One things to note is that it is slightly React inspired, so you will learn CSS from slightly a React point of view. For someone who is not using React at their workplace anymore (like me), the course for this reason can feel less relevant. Also, I found it a bit hard later on to find in the course something specific I wanted to read again when in need for it in my work, so personally I would prefer a book with an index over this 🙃 However, I have always been the person to enjoy learning the fundamentals first, then try to do assignments, so if you are more of a person that enjoys learning by doing, the course could be an excellent option for you.
Another thing to note, is that it is quite expensive, so it might not be as accessible to most people like a book. The basic package costs $149, but for the ultimate package you are closing in on $399. However, if your workplace sponsors courses like that, it is absolutely a great option for learning CSS.
