In print design grids are essential tool. Grid guide the eye and create balance. I because of the fluidity of the medium , if not for the fact that they are somewhat more challenging to accomplish properly ) I see many designers/coder just ignore the mathematical balance of grids OR use pre-made frameworks like 960grid. This, in itself, incurs the ire of some other designers.

I have been studying how these grid system works in the hopes of creating more of a streamlined system that doesn’t bloat markup and that can be used by itself or tacked on to stile rules ass needed. A fixed or fluid width grid system is simple enough to make and tiny enough to code… BUT try creating a fluid grid…grrr.

The problem lies in nesting columns…

the first level elements are a simple. (100%-(gutter%*(cols-1)))/cols; ; i can do this in my head, besides it’s only 6-10, maybe 12 calculations…

but what if someone wants a 10col grid ( for sake of math)… and a 2cols ( 5col-units wide each) and now wants break those up into 3 col in each: for the sake of math 2col-units x2 +1col-unit. so for this I had to break out the calc…

(100-(gutter*(cols-1)))/cols/((subcolsize/%)-(gutter*(subcols-1)))/cols;

Actually my math is wrong there i was just trying to illustrate how it gets complicated, plus now you have about 100 possible combination to cover all posibilites… as opposed to 10

if someone was a glutton for punishment and wanted the grid system to be effective at 3 levels deep the calculations get more complex and you end up needing close to 1000 rules to cover all possible combination… I needed a script to output this!

I cant even fathom what rules for a 16 col grid at 5 levels deep must be like!

So I am pondering how deep would most coders would go when using a grid… if that makes sense?