diff --git a/netbox/project-static/dist/netbox.css b/netbox/project-static/dist/netbox.css
index 11ceaee99..1ba025227 100644
Binary files a/netbox/project-static/dist/netbox.css and b/netbox/project-static/dist/netbox.css differ
diff --git a/netbox/project-static/dist/netbox.js b/netbox/project-static/dist/netbox.js
index acb084e6a..c56916132 100644
Binary files a/netbox/project-static/dist/netbox.js and b/netbox/project-static/dist/netbox.js differ
diff --git a/netbox/project-static/dist/netbox.js.map b/netbox/project-static/dist/netbox.js.map
index 040483b0f..ac3a0d68f 100644
Binary files a/netbox/project-static/dist/netbox.js.map and b/netbox/project-static/dist/netbox.js.map differ
diff --git a/netbox/project-static/src/sidenav.ts b/netbox/project-static/src/sidenav.ts
index d8207c9f7..97a86e4d2 100644
--- a/netbox/project-static/src/sidenav.ts
+++ b/netbox/project-static/src/sidenav.ts
@@ -204,7 +204,7 @@ class SideNav {
    * @param link Active nav link
    * @param action Expand or Collapse
    */
-  private activateLink(link: HTMLAnchorElement, action: 'expand' | 'collapse'): void {
+  private activateLink(link: HTMLDivElement, action: 'expand' | 'collapse'): void {
     // Find the closest .collapse element, which should contain `link`.
     const collapse = link.closest('.collapse') as Nullable<HTMLDivElement>;
     if (isElement(collapse)) {
@@ -232,13 +232,16 @@ class SideNav {
    * Find any nav links with `href` attributes matching the current path, to determine which nav
    * link should be considered active.
    */
-  private *getActiveLinks(): Generator<HTMLAnchorElement> {
-    for (const link of this.base.querySelectorAll<HTMLAnchorElement>(
-      '.navbar-nav .nav .nav-item a.nav-link',
+  private *getActiveLinks(): Generator<HTMLDivElement> {
+    for (const menuitem of this.base.querySelectorAll<HTMLDivElement>(
+      'ul.navbar-nav .nav-item .dropdown-item',
     )) {
-      const href = new RegExp(link.href, 'gi');
-      if (window.location.href.match(href)) {
-        yield link;
+      const link = menuitem.querySelector<HTMLAnchorElement>('a')
+      if (link) {
+        const href = new RegExp(link.href, 'gi');
+        if (window.location.href.match(href)) {
+          yield menuitem;
+        }
       }
     }
   }
@@ -309,7 +312,7 @@ class SideNav {
 }
 
 export function initSideNav(): void {
-  for (const sidenav of getElements<HTMLDivElement>('.sidenav')) {
+  for (const sidenav of getElements<HTMLDivElement>('.navbar')) {
     new SideNav(sidenav);
   }
 }
diff --git a/netbox/project-static/styles/netbox.scss b/netbox/project-static/styles/netbox.scss
index 5158ab6a0..e297d80ef 100644
--- a/netbox/project-static/styles/netbox.scss
+++ b/netbox/project-static/styles/netbox.scss
@@ -10,6 +10,7 @@
 // Transitional styling to ease migration of templates from NetBox v3.x
 @import 'transitional/cards';
 @import 'transitional/layout';
+@import 'transitional/navigation';
 @import 'transitional/tables';
 @import 'transitional/tabs';
 
diff --git a/netbox/project-static/styles/transitional/_navigation.scss b/netbox/project-static/styles/transitional/_navigation.scss
new file mode 100644
index 000000000..e676d7c98
--- /dev/null
+++ b/netbox/project-static/styles/transitional/_navigation.scss
@@ -0,0 +1,23 @@
+// Navbar styling
+.navbar-vertical.navbar-expand-lg {
+  .navbar-collapse {
+    .dropdown-menu {
+      .dropdown-item {
+
+        // Remove underline from nav menu items
+        a:hover {
+          text-decoration: none;
+        }
+
+        // Style active menu item
+        &.active {
+          background-color: $gray-700;
+          a {
+            color: white;
+          }
+        }
+
+      }
+    }
+  }
+}