scope th bottom vertical-align to only thead, update code styles to include more comments in less file and scrollable option for pre tag

docs/assets/css/bootstrap.css

@@ -374,8 +374,7 @@ ol {
 li {
   line-height: 18px;
 }
-ul.unstyled,
-ol.unstyled {
+ul.unstyled, ol.unstyled {
   margin-left: 0;
   list-style: none;
 }
@@ -499,6 +498,10 @@ pre code {
   background-color: transparent;
   border: 0;
 }
+.pre-scrollable {
+  max-height: 340px;
+  overflow-y: scroll;
+}
 form {
   margin: 0 0 18px;
 }
@@ -1004,14 +1007,14 @@ table {
   padding: 8px;
   line-height: 18px;
   text-align: left;
+  vertical-align: top;
   border-top: 1px solid #ddd;
 }
 .table th {
   font-weight: bold;
-  vertical-align: bottom;
 }
-.table td {
-  vertical-align: top;
+.table thead th {
+  vertical-align: bottom;
 }
 .table thead:first-child tr th, .table thead:first-child tr td {
   border-top: 0;

docs/assets/css/docs.css

@@ -481,9 +481,6 @@ hr.soften {
 /* Misc
 -------------------------------------------------- */
 
-pre.prettyprint {
-  overflow: hidden;
-}
 
 .browser-support {
   max-width: 100%;

docs/base-css.html

@@ -385,6 +385,7 @@ For example, <code>section</code> should be wrapped as inline.
 </pre>
 </pre>
       <p><strong>Note:</strong> Be sure to keep code within <code>&lt;pre&gt;</code> tags as close to the left as possible; it will render all tabs.</p>
+      <p>You may optionally add the <code>.pre-scrollable</code> class which will set a max-height of 350px and provide a y-axis scrollbar.</p>
     </div><!--/span-->
     <div class="span4">
       <h2>Google Prettify</h2>

docs/templates/pages/base-css.mustache

@@ -309,6 +309,7 @@
 </pre>
 </pre>
       <p>{{_i}}<strong>Note:</strong> Be sure to keep code within <code>&lt;pre&gt;</code> tags as close to the left as possible; it will render all tabs.{{/i}}</p>
+      <p>{{_i}}You may optionally add the <code>.pre-scrollable</code> class which will set a max-height of 350px and provide a y-axis scrollbar.{{/i}}</p>
     </div><!--/span-->
     <div class="span4">
       <h2>Google Prettify</h2>

docs/upgrading.html

@@ -248,6 +248,13 @@
   <div class="alert alert-info">
     <strong>Heads up!</strong> We're rewritten just about everything for our plugins, so head on over to <a href="./javascript.html">the Javascript page</a> to learn more.
   </div>
+  <h3>Tooltips</h3>
+  <ul>
+    <li>The plugin method has been renamed from <code>twipsy()</code> to <code>tooltip()</code>, and the class name changed from <code>twipsy</code> to <code>tooltip</code>.</li>
+    <li>The <code>placement</code> option value that was <code>below</code> is now <code>bottom</code>, and <code>above</code> is now <code>top</code>.</li>
+    <li>The <code>animate</code> option was renamed to <code>animation</code>.</li>
+    <li>The <code>html</code> option was removed, as the tooltips default to allowing HTML now.</li>
+  </ul>
   <h3>Popovers</h3>
   <ul>
     <li>Child elements now properly namespaced: <code>.title</code> to <code>.popover-title</code>, <code>.inner</code> to <code>.popover-inner</code>, and <code>.content</code> to <code>.popover-content</code>.</li>

less/code.less

@@ -11,12 +11,16 @@ pre {
   color: @grayDark;
   .border-radius(3px);
 }
+
+// Inline code
 code {
   padding: 3px 4px;
   color: #d14;
   background-color: #f7f7f9;
   border: 1px solid #e1e1e8;
 }
+
+// Blocks of code
 pre {
   display: block;
   padding: (@baseLineHeight - 1) / 2;
@@ -44,3 +48,9 @@ pre {
     border: 0;
   }
 }
+
+// Enable scrollable blocks of code
+.pre-scrollable {
+  max-height: 340px;
+  overflow-y: scroll;
+}

less/tables.less

@@ -25,14 +25,15 @@ table {
     padding: 8px;
     line-height: @baseLineHeight;
     text-align: left;
+    vertical-align: top;
     border-top: 1px solid #ddd;
   }
   th {
     font-weight: bold;
-    vertical-align: bottom;
   }
-  td {
-    vertical-align: top;
+  // Bottom align for column headings
+  thead th {
+    vertical-align: bottom;
   }
   // Remove top border from thead by default
   thead:first-child tr th,