ansaurus

Question

Answer 1

+2 A:

Try putting a   within the empty grid divs. There are some cross-browser issues with using empty 960.gs grid divs.

Edit: The following works perfectly in Firefox and Chrome. Perhaps your doctype or the container elements are not right?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"&gt;
<html lang="en">
  <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <title>960 Grid System &mdash; Test</title>
    <link rel="stylesheet" href="css/reset.css" />
    <link rel="stylesheet" href="css/text.css" />
    <link rel="stylesheet" href="css/960.css" />
    <style type="text/css"> 
      div.grid_3 { background-color: #0f0; }
      div.grid_2 { background-color: #f00; }
      div.grid_11 { background-color: #00f; }
    </style>
  </head>
  <body>
    <div class="container_16">
      <div class="grid_3 alpha">&nbsp;</div><div class="grid_2">&nbsp;</div><div class="grid_11">&nbsp;</div>
      <div class="clear" style="height:20px"></div>
      <div class="grid_3 alpha">&nbsp;</div><div class="grid_2">&nbsp;</div><div class="grid_11">&nbsp;</div>
      <div class="clear" style="height:20px"></div>
      <div class="grid_3 alpha">&nbsp;</div><div class="grid_2">&nbsp;</div><div class="grid_11">&nbsp;</div>
      <div class="clear" style="height:20px"></div>
      <div class="grid_3 alpha">&nbsp;</div><div class="grid_2">&nbsp;</div><div class="grid_11">&nbsp;</div>
      <div class="clear" style="height:20px"></div>
    </div>
  </body>
</html>

anshul 2010-02-25 12:32:25

hmm, didn't do the trick. somehow the "row" gets into the grid_11 div

alex 2010-02-25 12:39:39

Umm... Did the edit help?

anshul 2010-02-25 15:40:46

ansaurus

tags:

views:

answers:

How to repeat a grid row?

related questions