CSS Grids

Do you remember learning about newspaper design in your Pre-Press class? Me either!

Basically a newspaper page is usually broken up into five or six columns (usually 11 picas wide) and separated by gutter space. This allows for some interesting ways to charge for ads, and to create complex layouts including stories and images of varied sizes. The grid allows it to all make sense and have a feeling of uniformity; even though it’s common that every page is entirely different.

So why limit this to newsprint? This last week I’ve been playing with CSS grid layouts. It’s the same principle, now I’m dealing with 24 columns over 950px wide with 10px gutters. There are some really great frameworks available for download which allow you to start a grid layout within minutes. There are even some blank-canvas WordPress templates.

I have been working with a framework called Blueprint and I hope to have something to show soon. Here is a list of a few of the common Grid systems.

Blueprint CSS Framework
Yahoo Grids CSS
960 Grid System

Categorized in: Personal

This post was written by ArleyM