diff --git a/frontend/app.vue b/frontend/app.vue
index 8c48eb81..f6b0ade6 100644
--- a/frontend/app.vue
+++ b/frontend/app.vue
@@ -1,6 +1,6 @@
 <template>
   <NuxtLayout>
-    <Html lang="en" :data-theme="theme || 'homebox'" />
+    <Html :lang="locale" :data-theme="theme || 'homebox'" />
     <Link rel="icon" type="image/svg" href="/favicon.svg"></Link>
     <Link rel="apple-touch-icon" href="/apple-touch-icon.png" size="180x180" />
     <Link rel="mask-icon" href="/mask-icon.svg" color="#5b7f67" />
@@ -11,5 +11,9 @@
 </template>
 
 <script lang="ts" setup>
+  import { useI18n } from "vue-i18n";
+
   const { theme } = useTheme();
+
+  const { locale } = useI18n();
 </script>
diff --git a/frontend/layouts/default.vue b/frontend/layouts/default.vue
index d6d917f1..1f7ab6cd 100644
--- a/frontend/layouts/default.vue
+++ b/frontend/layouts/default.vue
@@ -79,6 +79,7 @@
                     :to="n.to"
                     :class="{
                       'bg-secondary text-secondary-content': n.active?.value,
+                      'text-nowrap': typeof locale === 'string' && locale.startsWith('zh-'),
                     }"
                   >
                     <component :is="n.icon" class="mr-4 size-6" />
@@ -114,7 +115,7 @@
   import MdiMenu from "~icons/mdi/menu";
   import MdiPlus from "~icons/mdi/plus";
 
-  const { t } = useI18n();
+  const { t, locale } = useI18n();
   const username = computed(() => authCtx.user?.name || "User");
 
   const preferences = useViewPreferences();
