Jiaaro

…on life, the universe, and everything

960gs Reference

I am sick of the 960.gs webpage I have shit to get done and I don't want to be sold on 960 -- just remind me what the damn css classes are.

Here is my own personal 960.gs documentation :)

note: In the list below XX is used to denote a number of columns

Quick reference:

  • container_XX
  • grid_XX
  • prefix_XX
  • suffix_XX
  • push_XX
  • pull_XX
  • alpha
  • omega
  • clear

container_XX

All elements in the page should be inside one of these -- it tells the grid system how many columns your layout should be.

grid_XX

Makes the element XX columns wide

prefix_XX

Shift the element XX columns to the right (take up XX more columns on the left)

suffix_XX

Push the next element XX columns to the right (take up XX more columns on the right)

push_XX

Shift this element XX columns to the right without affecting any other elements

pull_XX

Shift this element XX columns to the left without affecting any other elements

alpha / omega

When using grid_XX inside another grid_XX element. use alpha and omega on the first and last element respectively to avoid doubling the gutter padding.

clear

clears floated elements in a way that doesn't suck