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

4 files changed, 68 insertions, 25 deletions

diff --git a/less/forms.less b/less/forms.less
index dafe1c5c3..1367b1fd9 100644
--- a/less/forms.less
+++ b/less/forms.less
@@ -552,7 +552,7 @@ legend + .control-group {
   // Move over all input controls and content
   .controls {
     margin-left: 160px;
-    /* Super jank IE7 fix to ensure the inputs in .input-append and input-prepend don't inherit the margin of the parent, in this case .controls */
+    // Super jank IE7 fix to ensure the inputs in .input-append and input-prepend don't inherit the margin of the parent, in this case .controls
     *display: inline-block;
     *margin-left: 0;
     *padding-left: 20px;
diff --git a/less/mixins.less b/less/mixins.less
index a419a56ba..73e6ade56 100644
--- a/less/mixins.less
+++ b/less/mixins.less
@@ -522,9 +522,9 @@
   margin-left: @gridGutterWidth * -1;
   .clearfix();
 }
-.makeColumn(@columns: 1) {
+.makeColumn(@columns: 1, @offset: 0) {
   float: left;
-  margin-left: @gridGutterWidth;
+  margin-left: (@gridColumnWidth * @offset) + (@gridGutterWidth * (@offset - 1)) + (@gridGutterWidth * 2);
   width: (@gridColumnWidth * @columns) + (@gridGutterWidth * (@columns - 1));
 }
 
diff --git a/less/navs.less b/less/navs.less
index 4f4b6c327..a0cdad64a 100644
--- a/less/navs.less
+++ b/less/navs.less
@@ -270,9 +270,9 @@
 }
 
 // Remove border on bottom, left, right
-.tabs-below .nav-tabs,
-.tabs-right .nav-tabs,
-.tabs-left .nav-tabs {
+.tabs-below > .nav-tabs,
+.tabs-right > .nav-tabs,
+.tabs-left > .nav-tabs {
   border-bottom: 0;
 }
 
@@ -290,22 +290,22 @@
 // BOTTOM
 // ------
 
-.tabs-below .nav-tabs {
+.tabs-below > .nav-tabs {
   border-top: 1px solid #ddd;
 }
-.tabs-below .nav-tabs > li {
+.tabs-below > .nav-tabs > li {
   margin-top: -1px;
   margin-bottom: 0;
 }
-.tabs-below .nav-tabs > li > a {
+.tabs-below > .nav-tabs > li > a {
   .border-radius(0 0 4px 4px);
   &:hover {
     border-bottom-color: transparent;
     border-top-color: #ddd;
   }
 }
-.tabs-below .nav-tabs .active > a,
-.tabs-below .nav-tabs .active > a:hover {
+.tabs-below > .nav-tabs > .active > a,
+.tabs-below > .nav-tabs > .active > a:hover {
   border-color: transparent #ddd #ddd #ddd;
 }
 
@@ -313,51 +313,51 @@
 // ------------
 
 // Common styles
-.tabs-left .nav-tabs > li,
-.tabs-right .nav-tabs > li {
+.tabs-left > .nav-tabs > li,
+.tabs-right > .nav-tabs > li {
   float: none;
 }
-.tabs-left .nav-tabs > li > a,
-.tabs-right .nav-tabs > li > a {
+.tabs-left > .nav-tabs > li > a,
+.tabs-right > .nav-tabs > li > a {
   min-width: 74px;
   margin-right: 0;
   margin-bottom: 3px;
 }
 
 // Tabs on the left
-.tabs-left .nav-tabs {
+.tabs-left > .nav-tabs {
   float: left;
   margin-right: 19px;
   border-right: 1px solid #ddd;
 }
-.tabs-left .nav-tabs > li > a {
+.tabs-left > .nav-tabs > li > a {
   margin-right: -1px;
   .border-radius(4px 0 0 4px);
 }
-.tabs-left .nav-tabs > li > a:hover {
+.tabs-left > .nav-tabs > li > a:hover {
   border-color: @grayLighter #ddd @grayLighter @grayLighter;
 }
-.tabs-left .nav-tabs .active > a,
-.tabs-left .nav-tabs .active > a:hover {
+.tabs-left > .nav-tabs .active > a,
+.tabs-left > .nav-tabs .active > a:hover {
   border-color: #ddd transparent #ddd #ddd;
   *border-right-color: @white;
 }
 
 // Tabs on the right
-.tabs-right .nav-tabs {
+.tabs-right > .nav-tabs {
   float: right;
   margin-left: 19px;
   border-left: 1px solid #ddd;
 }
-.tabs-right .nav-tabs > li > a {
+.tabs-right > .nav-tabs > li > a {
   margin-left: -1px;
   .border-radius(0 4px 4px 0);
 }
-.tabs-right .nav-tabs > li > a:hover {
+.tabs-right > .nav-tabs > li > a:hover {
   border-color: @grayLighter @grayLighter @grayLighter #ddd;
 }
-.tabs-right .nav-tabs .active > a,
-.tabs-right .nav-tabs .active > a:hover {
+.tabs-right > .nav-tabs .active > a,
+.tabs-right > .nav-tabs .active > a:hover {
   border-color: #ddd #ddd #ddd transparent;
   *border-left-color: @white;
 }
diff --git a/less/tests/css-tests.html b/less/tests/css-tests.html
index 255a078b3..8dad598c9 100644
--- a/less/tests/css-tests.html
+++ b/less/tests/css-tests.html
@@ -445,6 +445,49 @@
 </div>
 
 
+<!-- Tabs
+================================================== -->
+
+<div class="tabbable tabs-left" style="margin-bottom: 18px;">
+  <ul class="nav nav-tabs">
+    <li class="active"><a href="#tab1" data-toggle="tab">Section 1</a></li>
+    <li><a href="#tab2" data-toggle="tab">Section 2</a></li>
+    <li><a href="#tab3" data-toggle="tab">Section 3</a></li>
+  </ul>
+  <div class="tab-content" style="padding-bottom: 9px; border-bottom: 1px solid #ddd;">
+    <div class="tab-pane active" id="tab1">
+      <p>I'm in Section 1.</p>
+
+      <div class="tabbable" style="background: #f5f5f5; padding: 20px;">
+        <ul class="nav nav-tabs">
+          <li class="active"><a href="#tab1-1" data-toggle="tab">1.1</a></li>
+          <li><a href="#tab1-2" data-toggle="tab">1.2</a></li>
+          <li><a href="#tab1-3" data-toggle="tab">1.3</a></li>
+        </ul>
+        <div class="tab-content" style="padding-bottom: 9px; border-bottom: 1px solid #ddd;">
+          <div class="tab-pane active" id="tab1-1">
+            <p>I'm in Section 1.1.</p>
+          </div>
+          <div class="tab-pane" id="tab1-2">
+            <p>I'm in Section 1.2.</p>
+          </div>
+          <div class="tab-pane" id="tab1-3">
+            <p>I'm in Section 1.3.</p>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div class="tab-pane" id="tab2">
+      <p>Howdy, I'm in Section 2.</p>
+    </div>
+    <div class="tab-pane" id="tab3">
+      <p>What up girl, this is Section 3.</p>
+    </div>
+  </div>
+</div> <!-- /tabbable -->
+
+
+