diff --git a/src/Masa.Stack.Components/Shared/Layouts/Components/Breadcrumbs.razor b/src/Masa.Stack.Components/Shared/Layouts/Components/Breadcrumbs.razor
index de38ca0b..dd7dd85d 100644
--- a/src/Masa.Stack.Components/Shared/Layouts/Components/Breadcrumbs.razor
+++ b/src/Masa.Stack.Components/Shared/Layouts/Components/Breadcrumbs.razor
@@ -10,9 +10,7 @@
                 var item = Items[i];
                 var isLast = i == Items.Count - 1;
                 <MBreadcrumbsItem @key="@item"
-                                  Href="@(isLast ? null : item.Href)"
-                                  Class="text-truncate d-inline-block"
-                                  Style="max-width: 240px;">
+                                  Href="@(isLast ? null : item.Href)">
                     @DT(item.Text)
                 </MBreadcrumbsItem>
             }
diff --git a/src/Masa.Stack.Components/wwwroot/css/app.css b/src/Masa.Stack.Components/wwwroot/css/app.css
index c04f5765..40acf5d5 100644
--- a/src/Masa.Stack.Components/wwwroot/css/app.css
+++ b/src/Masa.Stack.Components/wwwroot/css/app.css
@@ -886,6 +886,7 @@ h1:focus {
 .ms-breadcrumbs {
     padding: 0 !important;
     margin-left: -4px;
+    flex-wrap: nowrap;
 }
 
 .ms-breadcrumbs li {
@@ -910,6 +911,7 @@ h1:focus {
     border-top-right-radius: 8px;
     border-bottom-right-radius: 8px;
     color: grey;
+    overflow-wrap: anywhere;
 }
 
 .m-sheet.m-card {