Introduction

The Omega theme was the first to ever introduce the 24 column grid when it was added to the 960.gs package by Nathan Smith

The 24 column layout was included to give Blueprint fans the ability to have more columns, smaller gutters, while still using the tried and true structure of the 960 grid. I actually have used the 24 column layout several times just for clients that don't like the 20 pixel gutter between columns. I also used it for this blog at one point, while it was still running Drupal 6, and using the Alpha theme.

Why 32 Columns might be useful for your design

My biggest issue with the 24 column layout originally was its usable width being wider than the 12 and 16 column grids. The 12 and 16 column grids have 940 usable pixels, and the 24 column had 950 pixels. This made it impossible to use any combination of 12 and 16 with the 24 column layout.

As the illustrations below show using the 12 and 16 column layouts, it is possible to mix and match containers so that in various regions, you may want to put something together that can only be done in either the 12 OR 16 column layout. This example shows 3 equal width regions (only accomplished in the 12 column layout), and then 4 equal width regions (can be accomplished in the 12 or 16 column layout).

You can see above that the grid elements line up on the outer left and right edges, so you can easily mix and match 12 and 16 column containers to accomplish your layout/design needs. However, when throwing the 24 column layout into the mix, it is not quite so simple as seen below.

The above demonstration shows mixing a 12 and 24 column layout... Again, because the 24 column has 950 usable pixels instead of 940, they just don't line up, and without some creative design, you'll never get them to mix and match appropriately. You can see the differences on the left and right edges where the grid elements in the 24 column are pushed out an additional 5 pixels to each far edge.

With all this in mind.... The 32 column layout was my attempt to rectify this situation for my own personal needs, and also make it available to the users of the Omega theme. This version was generated (then heavily modified) by the grid system generator, and has both the fixed with (960 pixels) and fluid versions available in the Omega theme. Much thanks goes to Greg Stout for asking (I'm pretty sure sarcastically) if I would add a 32 column grid at one of our New Hampshire Drupal Group meetings.

The 32 column layout has (obviously) 32 columns, each 20 pixels wide, and with a left and right margin of 5 pixels, giving a 10 pixel gutter between columns, and a 5 pixel margin on the outer left and right of the container.

Now that we have a match for the 24 column layout, much like the 12 and 16 columns get to make out and look cool doing it, we can implement the 24 and 32 columns on the same page and line up as expected.

Finding the 32 column template

In the 7.x-2.x branch of Omega, there is now an assets folder that includes the overlays for all 4 grid sizes, including the new 32 column grid.

If you are looking for more flexibility from your grid and your Drupal base theme, then be sure to give the 2.x branch of Omega for Drupal 7 a spin in your next project!