I am utilizing the 960.gs framework to create a two-column ordered list with each list item containing a heading and paragraph. My issue is that I want the numbering to go across, not down (e.g., the top row should contain 1, 2 instead of 1, 3). The only solution I have found is to insert a DIV between the OL and LI elements. However, this method doesn't seem quite right, although I can't pinpoint why. What is the correct approach to achieve this layout? Below is the markup I currently have:
<div class="container_16">
<ol>
<div class="grid_8">
<li><h2>Heading</h2>
<p>Paragraph</p>
</li>
</div>
<div class="grid_8">
<li><h2>Heading</h2>
<p>Paragraph</p>
</li>
</div>
<div class="clear"></div>
<div class="grid_8">
<li><h2>Heading</h2>
<p>Paragraph</p>
</li>
</div>
<div class="grid_8">
<li><h2>Heading</h2>
<p>Paragraph</p>
</li>
</div>
<div class="clear"></div>
</ol>
</div>