diff --git a/apps/client/src/widgets/Breadcrumb.css b/apps/client/src/widgets/Breadcrumb.css
index fee2e9799..c64b6b517 100644
--- a/apps/client/src/widgets/Breadcrumb.css
+++ b/apps/client/src/widgets/Breadcrumb.css
@@ -36,4 +36,13 @@
         margin: 0;
         padding: 0;
     }
+
+    .dropdown-item span,
+    .dropdown-item strong {
+        max-width: 200px;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+        overflow: hidden;
+        display: block;
+    }
 }
diff --git a/apps/client/src/widgets/Breadcrumb.tsx b/apps/client/src/widgets/Breadcrumb.tsx
index 8f09fdd2b..bf26fef04 100644
--- a/apps/client/src/widgets/Breadcrumb.tsx
+++ b/apps/client/src/widgets/Breadcrumb.tsx
@@ -66,7 +66,7 @@ function BreadcrumbSeparatorDropdownContent({ notePath, noteContext, activeNoteP
                         onClick={() => noteContext?.setNote(childNotePath)}
                     >
                         {childNotePath !== activeNotePath
-                        ? note.title
+                        ? <span>{note.title}</span>
                         : <strong>{note.title}</strong>}
                     </FormListItem>
                 </li>