more spacing tweaks

docs/index.html

@@ -233,6 +233,8 @@
   <div class="page-header">
     <h1>Layouts <small>Basic templates to create webpages</small></h1>
   </div>
+
+  <!-- Fixed layout -->
   <div class="row">
     <div class="span4 columns">
       <h2>Fixed layout</h2>
@@ -250,7 +252,9 @@
 &lt;/body&gt;
 </pre>
     </div>
-  </div>
+  </div> <!-- /row -->
+
+  <!-- Fluid layout -->
   <div class="row">
     <div class="span4 columns">
       <h2>Fluid layout</h2>
@@ -274,7 +278,7 @@
 &lt;/body&gt;
 </pre>
     </div>
-  </div>
+  </div> <!-- /row -->
 </section>
 
 
@@ -284,6 +288,7 @@
     <h1>Typography <small>Headings, paragraphs, lists, and other inline type elements</small></h1>
   </div>
 
+  <!-- Headings & Paragraph Copy -->
   <div class="row">
     <div class="span4 columns">
       <h2>Headings and copy</h2>
@@ -304,6 +309,7 @@
     </div>
   </div>
 
+  <!-- Misc Elements -->
   <div class="row">
     <div class="span4 columns">
       <h2>Misc. elements</h2>
@@ -333,8 +339,9 @@
       <h3>Abbreviations</h3>
       <p>For abbreviations and acronyms, use the <code>&lt;abbr&gt;</code> tag (<code>&lt;acronym&gt;</code> is deprecated in <abbr title="HyperText Markup Langugage 5">HTML5</abbr>). Put the shorthand form within the tag and set a title for the complete name.</p>
     </div>
-</div>
+  </div> <!-- /row -->
 
+  <!-- Blockquotes -->
   <div class="row">
     <div class="span4 columns">
       <h2>Blockquotes</h2>
@@ -351,9 +358,9 @@
         <small>Dr. Julius Hibbert</small>
       </blockquote>
     </div>
-</div>
-
+  </div> <!-- /row -->
 
+  <!-- Types of Lists -->
   <h2>Lists</h2>
   <div class="row">
     <div class="span4 columns">
@@ -431,15 +438,16 @@
         <dd>Etiam porta sem malesuada magna mollis euismod.</dd>
       </dl>
     </div>
-</div>
+  </div> <!-- /row -->
 </section>
 
 
+
 <section id="tables">
   <div class="page-header">
     <h1>Tables <small>For, you guessed it, tabular data</small></h1>
   </div>
-
+  <!-- Table structure -->
   <div class="row">
     <div class="span4 columns">
       <h2>Building tables</h2>
@@ -494,7 +502,6 @@
 &lt;table class="common-table"&gt;
   ...
 &lt;/table&gt;</pre>
-
       <h3>Example: Zebra-striped</h3>
       <p>Get a little fancy with your tables by adding zebra-striping&mdash;just add the <code>.zebra-striped</code> class.</p>
       <table class="zebra-striped">
@@ -531,7 +538,6 @@
 &lt;table class="common-table zebra-striped"&gt;
 ...
 &lt;/table&gt;</pre>
-
       <h3>Example: Zebra-striped w/ TableSorter.js</h3>
       <p>Taking the previous example, we improve the usefulness of our tables by providing sorting functionality via <a href="http://jquery.com">jQuery</a> and the <a href="http://tablesorter.com/docs/">Tablesorter</a> plugin. <strong>Click any column’s header to change the sort.</strong></p>
       <table class="zebra-striped" id="sortTableExample">
@@ -575,17 +581,15 @@
   ...
 &lt;/table&gt;</pre>
     </div>
-</div>
+  </div> <!-- /row -->
 </section>
 
 
 
 <section id="forms">
-
   <div class="page-header">
     <h1>Forms</h1>
   </div>
-
   <div class="row">
     <div class="span4 columns">
       <h2>Default styles</h2>
@@ -765,7 +769,7 @@
         </fieldset>
       </form>
     </div>
-</div>
+  </div> <!-- /row -->
 
   <br />
 
@@ -828,7 +832,7 @@
         </div>
       </form>
     </div>
-</div>
+  </div> <!-- /row -->
 
   <div class="row">
     <div class="span4 columns">
@@ -866,7 +870,7 @@
         <button class="btn large" disabled>Action</button>
       </div>
     </div>
-</div>
+  </div> <!-- /row -->
 </section>