The Greatest CSS Tricks Vol. I Gets Real eBook Formats

When The Greatest CSS Tricks Vol. I first launched, it was only readable online — no PDF, no EPUB, nothing you'd normally expect from a digital book. That's changed. The book is now available as PDF and EPUB downloads, free for members. Just add it to your cart and check out.

The original web-only approach was deliberate. Writing in a blog-post format meant content lived at URLs, could include interactive demos, and gave the author full control over access. But it also meant no portable reading experience. Now there's a system in place that produces proper eBook files, and the tooling behind it is worth a closer look.

From Print Dialog to Programmatic Builds

The first attempt at a PDF version was embarrassingly simple: output the book's content on a clean template, apply print-friendly CSS, and use the browser's Print → Save as PDF. That mostly works. You can enable background graphics so code blocks keep their dark styling, and the result is passable. But it falls apart on details like controlling page headers and footers, and it's a manual process that doesn't scale.

The goal was automation, and help came from an unexpected place. A blog post by Baldur Bjarnason described exactly the kind of problem being solved: producing PDFs or eBooks from website content. That led to a collaboration and an automated pipeline that takes a single local .html file and generates PDF, EPUB, and MOBI formats from it. Running make from the command line kicks off the whole build.

The input HTML still needs to be near-perfect for the tooling to work well. A dedicated URL outputs the book's raw content with minimal styling, serving as the source for the eBook pipeline.

The Toolchain Behind the Formats

  • PDF: Both Paged.js and WeasyPrint were evaluated. Each had strengths and quirks; Paged.js ultimately won.
  • EPUB: Built with pandoc.
  • MOBI: Not a focus, but handled via Calibre's ebook-convert command-line tool.

Those core tools depend on other software — Python, pango, libffi, and more — but a script from Bjarnason handles installation and setup, making the whole thing easy to run.

Bjarnason also released a trimmed-down open-source version of the tooling as the book-tricks repo. The Makefile alone contains useful patterns for anyone converting simple HTML into eBook formats.

Previewing and Iterating

Previewing builds is straightforward on a Mac: PDFs open in Preview.app or a browser, EPUBs load directly into Books.app, and MOBI files are viewable in Calibre. The painful part is the feedback loop. Every tweak to the CSS requires a full rebuild to see the result, and getting things right took well over a hundred iterations. Live previews would be a welcome improvement.

Adapting Content for eBooks

The web version of the book leans heavily on embedded CodePen demos to show code and output. Those don't work in eBooks — iframes and JavaScript aren't reliable there. The solution was two-fold: hide the embedded demos from the eBook output with display: none, and add alternate content wrapped in a print-only class that only appears in the eBook versions. Custom blocks in the WordPress editor made authoring those alternate sections manageable.

One nicety of digital formats: no need for print stylesheet tricks like displaying URLs after links, since links are clickable and simply styled blue in the eBook.

The whole exercise was a learning experience in digital publishing. The tooling is now in place, the formats are shipping, and the door is open for future volumes. More importantly, the process — write once, publish everywhere — is now repeatable.