diff --git a/docs/assets/css/bootstrap.css b/docs/assets/css/bootstrap.css
index 7e47655b5c..249645d9ca 100644
--- a/docs/assets/css/bootstrap.css
+++ b/docs/assets/css/bootstrap.css
@@ -2693,13 +2693,7 @@ input[type="button"].btn-block {
   content: "\e160";
 }
 
-.dropup,
-.dropdown {
-  position: relative;
-}
-
-.dropdown-toggle:active,
-.open .dropdown-toggle {
+.open > a {
   outline: 0;
 }
 
@@ -2707,18 +2701,15 @@ input[type="button"].btn-block {
   display: inline-block;
   width: 0;
   height: 0;
-  vertical-align: top;
+  margin-top: 8px;
+  margin-left: 2px;
+  vertical-align: middle;
   border-top: 4px solid #000;
   border-right: 4px solid transparent;
   border-left: 4px solid transparent;
   content: "";
 }
 
-.dropdown .caret {
-  margin-top: 8px;
-  margin-left: 2px;
-}
-
 .dropdown-menu {
   position: absolute;
   top: 100%;
@@ -3140,6 +3131,7 @@ button.close {
 }
 
 .nav > li {
+  position: relative;
   display: block;
 }
 
@@ -3320,6 +3312,11 @@ button.close {
   display: block;
 }
 
+.nav-tabs .dropdown-menu {
+  border-top-right-radius: 0;
+  border-top-left-radius: 0;
+}
+
 /*
 // Prevent IE8 from misplacing imgs
 // See https://github.com/h5bp/html5-boilerplate/issues/984#issuecomment-3985989
diff --git a/less/dropdowns.less b/less/dropdowns.less
index c4fd8598bb..45242fb68c 100644
--- a/less/dropdowns.less
+++ b/less/dropdowns.less
@@ -2,14 +2,8 @@
 // Dropdown menus
 // --------------------------------------------------
 
-
-// Use the .menu class on any <li> element within the topbar or ul.tabs and you'll get some superfancy dropdowns
-.dropup,
-.dropdown {
-  position: relative;
-}
-.dropdown-toggle:active,
-.open .dropdown-toggle {
+// Remove the outline when :focus is triggered
+.open > a {
   outline: 0;
 }
 
@@ -19,19 +13,14 @@
   display: inline-block;
   width: 0;
   height: 0;
-  vertical-align: top;
+  margin-left: 2px;
+  vertical-align: middle;
   border-top:   4px solid #000;
   border-right: 4px solid transparent;
   border-left:  4px solid transparent;
   content: "";
 }
 
-// Place the caret
-.dropdown .caret {
-  margin-top: 8px;
-  margin-left: 2px;
-}
-
 // The dropdown menu (ul)
 // ----------------------
 .dropdown-menu {
diff --git a/less/navs.less b/less/navs.less
index 649eef92bd..7e8bcf87c9 100644
--- a/less/navs.less
+++ b/less/navs.less
@@ -12,8 +12,11 @@
   padding-left: 0; // Override default ul/ol
   list-style: none;
   .clearfix();
+
   > li {
+    position: relative;
     display: block;
+
     > a {
       position: relative;
       display: block;
@@ -44,7 +47,7 @@
       cursor: default;
     }
     // Space the headers out when they follow another list item (link)
-    &+ .nav-header {
+    + .nav-header {
       margin-top: 9px;
     }
   }
@@ -215,6 +218,15 @@
 
 
 
+// Dropdowns
+// -------------------------
+
+.nav-tabs .dropdown-menu {
+  // Remove the top rounded corners here since there is a hard edge above the menu
+  .border-top-radius(0);
+}
+
+
 /*
 // Prevent IE8 from misplacing imgs
 // See https://github.com/h5bp/html5-boilerplate/issues/984#issuecomment-3985989