Merge branch '1.3-wip' of github.com:twitter/bootstrap into 1.3-wip

1 files changed, 34 insertions, 0 deletions

diff --git a/docs/index.html b/docs/index.html
index 394d37ae6..9faf2feb6 100644
--- a/docs/index.html
+++ b/docs/index.html
@@ -712,6 +712,22 @@
       <p>Display thumbnails of varying sizes on pages with a low HTML footprint and minimal styles.</p>
     </div>
     <div class="span12">
+      <h3>Example thumbnails</h3>
+      <p>Thumbnails in the <code>.media-grid</code> can be any size, but they work best when mapped directly to the built-in Bootstrap grid system. Image widths like 90, 210, and 330 combine with a few pixels of padding to equal the <code>.span2</code>, <code>.span4</code>, and <code>.span6</code> column sizes.</p>
+      <h4>Large</h4>
+      <ul class="media-grid">
+        <li>
+          <a class="thumbnail" href="#">
+            <img src="http://placehold.it/330x230" alt="">
+          </a>
+        </li>
+        <li>
+          <a class="thumbnail" href="#">
+            <img src="http://placehold.it/330x230" alt="">
+          </a>
+        </li>
+      </ul>
+      <h4>Medium</h4>
       <ul class="media-grid">
         <li>
           <a class="thumbnail" href="#">
@@ -739,6 +755,24 @@
           </a>
         </li>
       </ul>
+      <h4>Small</h4>
+      <ul class="media-grid">
+        <li>
+          <a class="thumbnail" href="#">
+            <img src="http://placehold.it/90x90" alt="">
+          </a>
+        </li>
+        <li>
+          <a class="thumbnail" href="#">
+            <img src="http://placehold.it/90x90" alt="">
+          </a>
+        </li>
+        <li>
+          <a class="thumbnail" href="#">
+            <img src="http://placehold.it/90x90" alt="">
+          </a>
+        </li>
+      </ul>
     </div>
   </div><!-- /row -->
 </section>