1322px Grid


Now that 1366 is quickly becoming the most popular screen width, a 1322px grid with 22px gutters is ideal because you can divide the space into 24, 20, 12, 10, 8, 6, 4 and 3 columns. This easily allows for the rule of thirds, and also leaves you with 22px margins on each side of the grid.

Seems like we’ve finally hit the point where we can work in a nice big canvas. Would be great to have a responsive CSS framework built around this configuration. Anyone up for the challenge?

Here’s a quick PSD I created with the columns.

16 thoughts on “1322px Grid

  1. In one hand it’s nice. On the other you have responsive design where fluid columns seems better to fit whole canvas.

  2. Actually, according to statistics you have provided 1280 is still the most popular screen width.

  3. Thanks for sharing. One issue according to those stats is that around 38% are below the 1322px width mark. While this will slowly reduce, it is a strong issue. Also, the rise of phones and tablets, where do they factor in this? I am more inclined the ignore some restraining factors, and I much prefer a fixed grid (and bigger is better, so this is good news), but maybe fluid is the future to some extent?

  4. Interesting. I wonder how long it will take before it comfortably becomes the dominant lowest common denominator. Unless you’re designing around flexible layouts I don’t think its 100% viable yet to roll out on a massive scale.

  5. Actually 10 and 20 columns won’t work, but some other ones you didn’t mention will. Here is what I found:

    24, 21, 16, 14, 12, 8, 7, 6, 4, and 3 columns.

  6. A couple of years ago I was dreaming about the day when something like 1322px would become “standard”. Nowadays, after working on a couple more websites, I’ve changed my mind and think that 1024px is still plenty of space for most sites. Content heavy sites are a different story, of course.

Comments are closed.