How do I make the left and right gutters different colors with 960.gs?

Posted by Andrew Arrow on Stack Overflow See other posts from Stack Overflow or by Andrew Arrow
Published on 2010-04-04T21:06:59Z Indexed on 2010/04/04 21:13 UTC
Read the original article Hit count: 359

Filed under:
|

How do I make the left and right gutters different colors with 960.gs? When I try something simple like:

<div style="background-color: green">
  <div class="container_16">
    <div class="grid_16">
      test
    </div>
  </div>
</div>
<div style="background-color: cyan">
  <div class="container_16">
    <div class="grid_16">
      test
    </div>
  </div>
</div>

The green and cyan colors are ignored. Seems like the "grid_16" class removes the color for some reason? My goal is being able to have different sections of the page in different colors all the way across the page, even past 960 pixels. So if someone makes their browser 1200px the left and right sides have the right color and the rest of the grid system is all contained within the 960 pixels in the middle.

I could add a background color to 'body' to do this for just 1 color, but I want multiple colors in the page. Like different colored horizontal stripes. Thanks.

© Stack Overflow or respective owner

Related posts about 960

Related posts about 960.gs