PablosBrain MashGrid

After searching high and low for a grid system that works the way I want... I found two grid systems that I really liked.

Both are great grids... but either have too much extra stuff or not enough in them. So I created my own mash-up of the two. Below are all the features I've tried to incorporate/accomplish:

A page to start a template from
Support as many browsers as possible (reasonably well with limitations)
Flexible percentages based grid
Nestable
Automatically resize images to stay within their columns/containers
Designate objects to be only displayed on mobile or non-mobile
Offset columns
Media query break at 500px width for single column
Can change media query break point with one change to CSS file (not spread all over in multiple css tags/references)
IE HTML5 Shiv - http://code.google.com/p/html5shiv/
IE CSS3 Media Queries - http://code.google.com/p/css3-mediaqueries-js/

Change Log

Version 3 - 11/30/2011

Added more helper css classes
mashgrid_v3.zip

Version 2 - 11/18/2011

Added a bunch of helper css classes for faster layout
Added Non Breaking/Collapsing Grid
Made images inside a .column shrink to fit by setting max-width and auto height. Can also use the .fitimages class on any node containing images.
Added .maximages class for columns to optionally make all child images scale to 100% width and auto height within their containing node.
Fixed IE hide/show issues with .displaysmallonly and .displaylargeonly classes
Changed column margins slightly smaller percentage to account for IE rendering/calculation differences
Added conditional IE doctype declaration to kick IE into strict mode to support accurate :first-child selection
mashgrid_v2.zip

Version 1 - 11/17/2011

First release
mashgrid_v1.zip

Resize the width of your browser window to see the fun!

.displaylargeonly

.displaysmallonly

.grid_2

.grid_3

.grid_4

.grid_5

.grid_7

.grid_6

.grid_7

.grid_5

.grid_8

.grid_4

.grid_9

.grid_3

.grid_10

.grid_2

.grid_11

.grid_12

Column Offsets

.offset_1

.offset_2

.offset_3

.offset_4

.offset_5

offset_6

offset_7

.offset_8

.offset_9

.offset_10

Non Breaking/Collapsing Grid

.nbgrid_4

.nbgrid_5

.nbgrid_7

.nbgrid_10

.nbgrid_2

Images Within Columns Within Rows Within Columns Within Rows

.grid_8 .maximages

.grid_6

.grid_4

.grid_6

Sample Image - Not resized