Skip to content
This repository

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
tree: 4f2c34f807

Fetching latest commit…

Octocat-spinner-32-eaf2f5

Cannot retrieve the latest commit at this time

..
Octocat-spinner-32 img
Octocat-spinner-32 README.md
Octocat-spinner-32 grid.css
Octocat-spinner-32 index.htm
Octocat-spinner-32 reset.css
Octocat-spinner-32 screen.css
README.md

This is a collection of files I’m using to teach grid-based design principles in my Standards-Based Web Design class.

978 Widths and Offsets

  Units       Width       Offset      Abs Offset (+15)
   1          54          84          99
   2          138         168         183
   3          222         252         267
   4          306         336         351
   5          390         420         435
   6          474         504         519
   7          558         588         603
   8          642         672         687
   9          726         756         771
  10          810         840         855
  11          894         924         939
  12          978         -           -

To Do

  • Make the baseline grid images translucent
  • Make column/unit images for the other 978 sizes
  • Rework file/folder structure for easier integration with the RPK
  • Add in media queries to work with the 978 break points

Various notes to self:

  • Created column unit images with Pixelmator; a white/background layer at 20% opacity, and a gray layer (RGB 176,176,176) at 50% opacity.
  • Typo grids use colors RGB 148,209,225 and RGB 132,187,201.
Something went wrong with that request. Please try again.