diff --git a/app/src/assets/scss/business/_av.scss b/app/src/assets/scss/business/_av.scss
index 0a4f490ce..81f78b550 100644
--- a/app/src/assets/scss/business/_av.scss
+++ b/app/src/assets/scss/business/_av.scss
@@ -91,6 +91,7 @@
   &__cell {
     padding: 5px;
     flex-shrink: 0;
+    overflow: hidden;
     border-right: 1px solid var(--b3-theme-surface-lighter)
   }
 
@@ -116,6 +117,7 @@
 
     .b3-menu {
       width: 300px;
+      max-height: 70vh;
 
       .block__icon {
         line-height: 20px;
diff --git a/app/src/protyle/render/av/cell.ts b/app/src/protyle/render/av/cell.ts
index 71d750ba4..b4ae20b5c 100644
--- a/app/src/protyle/render/av/cell.ts
+++ b/app/src/protyle/render/av/cell.ts
@@ -192,10 +192,23 @@ export const showHeaderCellMenu = (protyle: IProtyle, blockElement: HTMLElement,
         menu.addSeparator();
     }
     menu.addItem({
-        label: `<div class="fn__flex" style="margin-bottom: 4px"><span>${window.siyuan.languages.wrap}</span><span class="fn__space fn__flex-1"></span>
-<input type="checkbox" class="b3-switch fn__flex-center"${cellElement.getAttribute("data-wrap") === "true" ? " checked" : ""}></div>`,
-        click() {
-
+        label: `<div class="fn__flex" style="margin: 4px 0"><span>${window.siyuan.languages.wrap}</span><span class="fn__space fn__flex-1"></span>
+<input type="checkbox" class="b3-switch fn__flex-center"${cellElement.style.whiteSpace === "nowrap" ? "" : " checked"}></div>`,
+        bind(element) {
+            const inputElement = element.querySelector("input") as HTMLInputElement;
+            inputElement.addEventListener("change", () => {
+                transaction(protyle, [{
+                    action: "setAttrViewColWrap",
+                    id: colId,
+                    parentID: avId,
+                    data: inputElement.checked
+                }], [{
+                    action: "setAttrViewColWrap",
+                    id: colId,
+                    parentID: avId,
+                    data: !inputElement.checked
+                }]);
+            });
         }
     });
     const cellRect = cellElement.getBoundingClientRect();
diff --git a/app/src/protyle/render/av/render.ts b/app/src/protyle/render/av/render.ts
index 7330e0e77..3330ab7e6 100644
--- a/app/src/protyle/render/av/render.ts
+++ b/app/src/protyle/render/av/render.ts
@@ -28,7 +28,9 @@ export const avRender = (element: Element, cb?: () => void) => {
                     if (column.hidden) {
                         return;
                     }
-                    tableHTML += `<div draggable="true" class="av__cell" data-index="${index}" data-id="${column.id}" data-dtype="${column.type}" data-wrap="${column.wrap}" style="width: ${column.width || 200}px;">
+                    tableHTML += `<div draggable="true" class="av__cell" data-index="${index}" data-id="${column.id}" data-dtype="${column.type}"  
+style="width: ${column.width || 200}px;
+${column.wrap ? "" : "white-space: nowrap;"}">
     <svg><use xlink:href="#${column.icon || getColIconByType(column.type)}"></use></svg>
     <span>${column.name}</span>
 </div>`;
@@ -66,7 +68,12 @@ export const avRender = (element: Element, cb?: () => void) => {
                         } else if (cell.valueType === "date") {
                             text = cell.value?.date.content || "";
                         }
-                        tableHTML += `<div class="av__cell" ${cell.valueType === "block" ? 'data-block-id="' + (cell.value.block.id || "") + '"' : ""} data-id="${cell.id}" data-index="${index}" style="width: ${data.columns[index].width || 200}px;${cell.bgColor ? `background-color:${cell.bgColor};` : ""}${cell.color ? `color:${cell.color};` : ""}">${text}</div>`;
+                        tableHTML += `<div class="av__cell" data-id="${cell.id}" data-index="${index}" 
+${cell.valueType === "block" ? 'data-block-id="' + (cell.value.block.id || "") + '"' : ""}  
+style="width: ${data.columns[index].width || 200}px;
+${data.columns[index].wrap ? "" : "white-space: nowrap;"}
+${cell.bgColor ? `background-color:${cell.bgColor};` : ""}
+${cell.color ? `color:${cell.color};` : ""}">${text}</div>`;
                     });
                     tableHTML += "<div></div></div>";
                 });