Back to Top
The nuts and bolts for
Creative web development

960 Grid - What Is It And How Handy It Is For CSS Layout

“Focus on the Grid brings Innovation within your Reach”

We noticed the wide usage of The 960 Grid System created by the great web developer Nathan Smith and put our developers on the task to create a quick and easy Dreamweaver Extension based on this amazing innovative system.

The usability gets a more visual tense so you can add/remove rows and columns directly in Dreamweaver.

The Story


 The 960 Grid System in Detail

  • Essence
    The 960 Grid System is an effort to streamline web development workflow by providing commonly used dimensions, based on a width of 960 pixels. There are two variants: 12 and 16 columns, which can be used separately or in tandem.
  • Dimensions
    The 12-column grid is divided into portions that are 60 pixels wide. The 16-column grid consists of 40 pixel increments. Each column has 10 pixels of margin on the left and right, which create 20 pixel wide gutters between column.
  • Purpose
    The premise of the system is ideally suited to rapid prototyping, but it would work equally well when integrated into a production environment. There are printable sketch sheets, design layouts, and a CSS file that have identical measurements.
Read more about the 960 Grid System at http://960.gs/

Do you Have a Great Feature Request?

If you have ideas for "must have" features of such Dreamweaver extension - please let us know directly by sending a mail to George.

Want to share your 960gs design?

We have been playing with the idea to offer a generic designs template repository. We will let you notice about this new Extensions very soon! So stay tuned for more highlights and features!

Also if you already have made some designs with the 960 grid system and you are willing to share them with other users in the upcoming DMXzone repository for this, send them to George as well.

Share this Article