960 CSS Framework, how to get full 960 width?

Question

Im using the 960 css framework. I have this code:

<div class="container_16" id="header">
  div class="grid_16">Header</div>
</div>

960 adds 10px gutters to the left and right side of the grids. I want to use the full 960 width. So I read to use alpha and omega to remove the 10px gutters from the left and right side. However is this the correct way of using the 960 framework?

<div class="container_16" id="header">
      div class="grid_16 alpha omega">header</div>
  </div>
  <div class="container_16" id="nav">
      div class="grid_16 alpha omega">nav</div>
  </div>
  <div class="container_16" id="body">
      div class="grid_16 alpha omega">body</div>
  </div>
  <div class="container_16" id="footer">
      div class="grid_16 alpha omega">footer</div>
  </div>

Just doesnt seem like it was meant to be used that way. But I dont want the spacing on the left and right side.

score 0 · Accepted Answer · answered Aug 05 '11 at 20:27

The grid is designed to have gutters on the left and right sides. If you don't want to do that, you need to use alpha and omega classes. However, they were designed for nested block elements, not really for use in this way.

If the 960 grid is not fitting your preferences, change it until you like it. It is not meant to be something rigid, it's a jumping off point for you to customize and streamline.

960 CSS Framework, how to get full 960 width?

1 Answers1