diff --git a/app/src/assets/scss/_layout.scss b/app/src/assets/scss/_layout.scss
index 4c08f3c53..71b1b0562 100644
--- a/app/src/assets/scss/_layout.scss
+++ b/app/src/assets/scss/_layout.scss
@@ -119,6 +119,11 @@
         background-color: var(--b3-theme-primary-lightest);
       }
 
+      &--readonly {
+        flex-shrink: 0;
+        min-width: 71px;
+      }
+
       .item {
         line-height: 22px;
         cursor: pointer;
@@ -129,6 +134,8 @@
         flex: 1;
         min-height: 42px;
         position: relative;
+        max-width: 186px;
+        flex-shrink: 0;
 
         &:hover:not(.item--focus):not(.item--readonly) .item__text {
           color: var(--b3-theme-on-background);
@@ -143,6 +150,7 @@
 
         &--readonly {
           padding-left: 13px;
+          max-width: none;
 
           .item__close svg {
             opacity: 1;
@@ -206,12 +214,14 @@
         }
 
         &__text {
-          @include text-clamp(1);
           text-align: center;
           -webkit-font-smoothing: subpixel-antialiased;
           color: var(--b3-theme-on-surface);
           transition: var(--b3-transition);
           padding: 0 8px;
+          white-space: nowrap;
+          overflow: hidden;
+          -webkit-mask-image: linear-gradient(to left, rgba(0, 0, 0, 0) 0, #000 12px);
         }
 
         &__close {
diff --git a/app/src/assets/scss/base.scss b/app/src/assets/scss/base.scss
index 7c4ac33fb..2060630b8 100644
--- a/app/src/assets/scss/base.scss
+++ b/app/src/assets/scss/base.scss
@@ -1,5 +1,6 @@
 @import "keyframes";
 @import "mixin";
+@import "function";
 @import "chip";
 @import "slider";
 @import "switch";
@@ -18,7 +19,6 @@
 @import "layout";
 @import "block";
 @import "reset";
-@import "function";
 @import "card";
 @import "menu";
 @import "color";
diff --git a/app/src/layout/Wnd.ts b/app/src/layout/Wnd.ts
index c73a38ac8..aa2f84531 100644
--- a/app/src/layout/Wnd.ts
+++ b/app/src/layout/Wnd.ts
@@ -49,10 +49,11 @@ export class Wnd {
         }
         this.element.innerHTML = `<div data-type="wnd" data-id="${this.id}" class="fn__flex-column fn__flex fn__flex-1">
     <div class="fn__flex fn__none">
-        <ul class="fn__flex layout-tab-bar fn__flex-1"></ul>
-        <ul class="layout-tab-bar">
+        <ul class="fn__flex layout-tab-bar"></ul>
+        <ul class="layout-tab-bar layout-tab-bar--readonly fn__flex-1">
             <li class="item item--readonly">
                 <span data-type="new" class="item__close" title="${window.siyuan.languages.newFile}"><svg style="height: 10px;width: 10px;padding: 3px"><use xlink:href="#iconAdd"></use></svg></span>
+                <span class="fn__flex-1"></span>
                 <span data-type="more" data-menu="true" class="item__close" title="${window.siyuan.languages.more}"><svg><use xlink:href="#iconDown"></use></svg></span>
             </li>
         </ul>