The base files used to create the figures for “CSS: The Definitive Guide, 4th Edition”.
HTML CSS
Switch branches/tags
Nothing to show
Clone or download
Permalink
Failed to load latest commit information.
01-css-and-documents Added link to index footers Oct 25, 2017
02-selectors Added link to index footers Oct 25, 2017
03-specificity-and-the-cascade Added link to index footers Oct 25, 2017
04-values-and-units Added link to index footers Oct 25, 2017
05-fonts Added link to index footers Oct 25, 2017
06-text-properties Added link to index footers Oct 25, 2017
07-basic-visual-formatting Added link to index footers Oct 25, 2017
08-padding-borders-outlines-and-margins Added link to index footers Oct 25, 2017
09-colors-backgrounds-and-gradients Added link to index footers Oct 25, 2017
10-floating-and-shapes Added link to index footers Oct 25, 2017
11-positioning Added link to index footers Oct 25, 2017
12-flexbox Fixed a minor but very annoying type in Chapter 12’s index page Nov 17, 2017
13-grid-layout Added link to index footers Oct 25, 2017
14-table-layout-in-css Added link to index footers Oct 25, 2017
15-lists-and-generated-content Added link to index footers Oct 25, 2017
16-transforms Added link to index footers Oct 25, 2017
17-transitions Added link to index footers Oct 25, 2017
18-animations Merge pull request #3 from estelle/patch-3 Nov 6, 2017
19-filters-blending-clipping-masking Changed i/Cloud.svg to i/cloud.svg (issue #5) Feb 26, 2018
20-media-dependent-styles Added link to index footers Oct 25, 2017
discards Added link to index footers Oct 25, 2017
styles Updated the index page for what might be the last time Oct 24, 2017
.gitignore Setting up local hidey-holes Jul 31, 2017
LICENSE Initial commit Jul 13, 2015
README.md Updated README.md for final relase Oct 27, 2017
index.html Corrected Chapter 20 title Oct 27, 2017

README.md

csstdg4figs

This repository contains the files used to create the figures for CSS: The Definitive Guide, 4th Edition. I mostly did this by loading them up in Firefox OS X and using the screenshot command-line utility (see “Essential Tool: Firefox’s screenshot Command” for more information)—except in the rare cases where Firefox didn’t support the thing I was illustrating, in which case I used Chrome OS X set to somewhere around 200% zoom.

Notes

  • If you want an easy-to-browse method of access, load the repo-root-level index.html in a web browser and surf from there. Also available on GitHub Pages.
  • Each chapter’s page lists all of the figures’ captions in the order they appear in the book. Where a caption is a link, it leads to the files used to create the figure in question. Where it’s unlinked text, there are no files to see. (Thus: if a figure is a diagram that wasn’t created in-browser, or the files were lost, or it was judged not to be useful in a browser setting, it will be listed but not linked.)
  • Chapters 17 and 18 (“Transitions” and “Animations”) have extra examples that do not correspond to figures in the book, but are instead referenced from within the book using small “push play” icons. This is how we dealt with the difficulty of illustrating animations in print.
  • What you see in your browser may or may not match what’s shown in the book’s figure. I have made essentially no effort to vendor-prefix or otherwise work around cross-browser limitations, except where doing so was germane to the content in the actual book. When in doubt, see the book for compatibility information.
  • The styling of the index pages uses, as much as reasonable, new features of CSS in a progressively-enhancing way. So don’t forget to view source and poke around in the styles directory!