diff --git a/R/bootstrap.R b/R/bootstrap.R
index 2ebc8536e4..a8614147ba 100644
--- a/R/bootstrap.R
+++ b/R/bootstrap.R
@@ -1085,7 +1085,18 @@ buildDropdown <- function(divTag, tabset) {
       divTag$title,
       tags$b(class = "caret")
     ),
-    navList
+    navList,
+    .renderHook = function(x) {
+      if (isTRUE(getCurrentThemeVersion() >= 4)) {
+        tagQuery(x)$
+          addClass("nav-item")$
+          find("dropdown-toggle")$
+          addClass("nav-link")$
+          allTags()
+      } else {
+        x
+      }
+    }
   )
 
   list(
diff --git a/tests/testthat/_snaps/tabPanel.md b/tests/testthat/_snaps/tabPanel.md
index e83e0d4391..5debffa709 100644
--- a/tests/testthat/_snaps/tabPanel.md
+++ b/tests/testthat/_snaps/tabPanel.md
@@ -86,7 +86,7 @@
               B
             </a>
           </li>
-          <li class="dropdown">
+          <li class="dropdown nav-item">
             <a href="#" class="dropdown-toggle" data-toggle="dropdown" data-value="Menu">
               Menu
               <b class="caret"></b>
@@ -121,7 +121,7 @@
               B
             </a>
           </li>
-          <li class="dropdown">
+          <li class="dropdown nav-item">
             <a href="#" class="dropdown-toggle" data-toggle="dropdown" data-value="Menu">
               Menu
               <b class="caret"></b>
@@ -204,7 +204,7 @@
                 B
               </a>
             </li>
-            <li class="dropdown">
+            <li class="dropdown nav-item">
               <a href="#" class="dropdown-toggle" data-toggle="dropdown" data-value="Menu">
                 Menu
                 <b class="caret"></b>
@@ -284,7 +284,7 @@
                 B
               </a>
             </li>
-            <li class="dropdown">
+            <li class="dropdown nav-item">
               <a href="#" class="dropdown-toggle" data-toggle="dropdown" data-value="Menu">
                 Menu
                 <b class="caret"></b>