Fixes #7438: remove max-height from justified nav tabs with some CSS wankery

2 files changed, 32 insertions, 3 deletions

diff --git a/docs/assets/css/bootstrap.css b/docs/assets/css/bootstrap.css
index f35962995..c59d1aae7 100644
--- a/docs/assets/css/bootstrap.css
+++ b/docs/assets/css/bootstrap.css
@@ -3250,7 +3250,7 @@ button.close {
 }
 
 .nav-justified {
-  max-height: 40px;
+  width: 100%;
 }
 
 .nav-justified > li {
@@ -3260,6 +3260,22 @@ button.close {
   text-align: center;
 }
 
+.nav-justified.nav-tabs {
+  border-bottom: 0;
+}
+
+.nav-justified.nav-tabs > li > a {
+  border-bottom: 1px solid #ddd;
+}
+
+.nav-justified.nav-tabs > .active > a {
+  border-bottom-color: #ffffff;
+}
+
+.nav-justified > li > a {
+  margin-right: 0;
+}
+
 .nav > .disabled > a {
   color: #999999;
 }
diff --git a/less/navs.less b/less/navs.less
index 88641229c..ff65f8533 100644
--- a/less/navs.less
+++ b/less/navs.less
@@ -107,8 +107,7 @@
 // -------------------------
 
 .nav-justified {
-  // Negative margin doesn't work, so we hack it
-  max-height: 40px;
+  width: 100%;
 }
 .nav-justified > li {
   float: none;
@@ -116,6 +115,20 @@
   width: 1%;
   text-align: center;
 }
+// Move borders to anchors instead of bottom of list
+.nav-justified.nav-tabs {
+  border-bottom: 0;
+  > li > a {
+    border-bottom: 1px solid #ddd;
+  }
+  > .active > a {
+    border-bottom-color: @body-bg;
+  }
+}
+// Override margin from .nav-tabs
+.nav-justified > li > a {
+  margin-right: 0;
+}