diff --git a/packages/web-app-files/src/components/Spaces/SpaceHeader.vue b/packages/web-app-files/src/components/Spaces/SpaceHeader.vue
index 6ef146e983..e1ac49176f 100644
--- a/packages/web-app-files/src/components/Spaces/SpaceHeader.vue
+++ b/packages/web-app-files/src/components/Spaces/SpaceHeader.vue
@@ -76,10 +76,10 @@
         v-else-if="markdownResource && markdownContent"
         ref="markdownContainerRef"
         class="markdown-container flex"
-        :class="{ 'mask-linear-[180deg,black,transparent]': markdownCollapsed }"
+        :class="{ 'mask-linear-[180deg,black,transparent] collapsed': markdownCollapsed }"
       >
         <text-editor
-          class="markdown-container-content"
+          class="markdown-container-content w-full"
           is-read-only
           :current-content="markdownContent"
         />
@@ -161,8 +161,8 @@ const toggleMarkdownCollapsedText = computed(() => {
 })
 const toggleMarkdownCollapsed = () => {
   markdownCollapsed.value = !unref(markdownCollapsed)
-  unref(markdownContainerRef).classList.toggle(markdownContainerCollapsedClass)
 }
+
 const onMarkdownResize = () => {
   if (!unref(markdownContainerRef)) {
     return
@@ -316,8 +316,13 @@ const openSideBarSharePanel = () => {
   .space-header-squashed .space-header-image {
     @apply hidden lg:block;
   }
+
   .space-header .markdown-container.collapsed {
     @apply max-h-[100px] overflow-hidden;
   }
+
+  .space-header .markdown-container #text-editor-preview-component {
+    @apply !bg-transparent;
+  }
 }
 </style>
diff --git a/packages/web-app-files/tests/unit/components/Spaces/__snapshots__/SpaceHeader.spec.ts.snap b/packages/web-app-files/tests/unit/components/Spaces/__snapshots__/SpaceHeader.spec.ts.snap
index 58de220aef..6a757244bd 100644
--- a/packages/web-app-files/tests/unit/components/Spaces/__snapshots__/SpaceHeader.spec.ts.snap
+++ b/packages/web-app-files/tests/unit/components/Spaces/__snapshots__/SpaceHeader.spec.ts.snap
@@ -76,7 +76,7 @@ exports[`SpaceHeader > space description > should show the description 1`] = `
       </button>
     </div>
     <!--v-if-->
-    <div class="markdown-container flex mask-linear-[180deg,black,transparent]">
+    <div class="markdown-container flex mask-linear-[180deg,black,transparent] collapsed">
       <!---->
       <div class="markdown-container-edit ml-2"><a attrs="[object Object]" aria-label="Edit description" class="oc-button-secondary oc-button-raw oc-button-secondary-raw gap-2 justify-center text-sm min-h-3 oc-button inline-flex cursor-pointer disabled:opacity-60 disabled:cursor-default p-1"></a></div>
     </div>