diff --git a/src/layout/components/Menu/src/components/useRenderMenuTitle.tsx b/src/layout/components/Menu/src/components/useRenderMenuTitle.tsx
index 8941d9d76..680c24cba 100644
--- a/src/layout/components/Menu/src/components/useRenderMenuTitle.tsx
+++ b/src/layout/components/Menu/src/components/useRenderMenuTitle.tsx
@@ -10,12 +10,20 @@ export const useRenderMenuTitle = () => {
     return icon ? (
       <>
         <Icon icon={meta.icon}></Icon>
-        <span class="v-menu__title overflow-hidden overflow-ellipsis whitespace-nowrap">
+        <span
+          class="v-menu__title truncate"
+          style="padding-right: calc(var(--el-menu-base-level-padding) + 12px);"
+          title={t(title as string)}
+        >
           {t(title as string)}
         </span>
       </>
     ) : (
-      <span class="v-menu__title overflow-hidden overflow-ellipsis whitespace-nowrap">
+      <span
+        class="v-menu__title truncate"
+        style="padding-right: calc(var(--el-menu-base-level-padding) + 12px);"
+        title={t(title as string)}
+      >
         {t(title as string)}
       </span>
     )