diff --git a/app/src/assets/scss/component/_typography.scss b/app/src/assets/scss/component/_typography.scss
index 8ce3ee588..282874c83 100644
--- a/app/src/assets/scss/component/_typography.scss
+++ b/app/src/assets/scss/component/_typography.scss
@@ -441,14 +441,18 @@
     }
 
     .protyle-action__title {
-      width: 100%;
-      display: block;
+      display: flex;
       font-size: 85%;
       color: var(--b3-theme-on-surface);
       word-break: break-word;
       white-space: break-spaces;
       line-height: normal;
       padding: 4px 0;
+
+      & > span {
+        flex-grow: 1;
+        width: 0;
+      }
     }
   }
 
diff --git a/app/src/menus/protyle.ts b/app/src/menus/protyle.ts
index f615db85a..bcdcfbfcf 100644
--- a/app/src/menus/protyle.ts
+++ b/app/src/menus/protyle.ts
@@ -1173,7 +1173,6 @@ export const imgMenu = (protyle: IProtyle, range: Range, assetElement: HTMLEleme
                 alignImgLeft(protyle, nodeElement, [assetElement], id, html);
             }
         }).element);
-        const width = imgElement.style.width.endsWith("vw") ? parseInt(imgElement.style.width) : 0;
         let rangeElement: HTMLInputElement;
         window.siyuan.menus.menu.append(new MenuItem({
             label: window.siyuan.languages.width,
@@ -1181,7 +1180,7 @@ export const imgMenu = (protyle: IProtyle, range: Range, assetElement: HTMLEleme
                 iconHTML: "",
                 type: "readonly",
                 label: `<div class="fn__flex-center">
-<input class="b3-text-field" value="${imgElement.style.width.endsWith("px") ? parseInt(imgElement.style.width) : ""}" type="number" style="margin: 4px" placeholder="${window.siyuan.languages.width}"> px
+<input class="b3-text-field" style="margin: 4px 8px 4px 0" value="${imgElement.style.width.endsWith("px") ? parseInt(imgElement.style.width) : ""}" type="number" placeholder="${window.siyuan.languages.width}">px
 </div>`,
                 bind(element) {
                     const inputElement = element.querySelector("input");
@@ -1213,13 +1212,13 @@ export const imgMenu = (protyle: IProtyle, range: Range, assetElement: HTMLEleme
                 }, {
                     iconHTML: "",
                     type: "readonly",
-                    label: `<div style="margin: 4px 0;" aria-label="${imgElement.style.width.endsWith("px") ? imgElement.style.width : (imgElement.style.width?.replace("vw", "%") || window.siyuan.languages.default)}" class="b3-tooltips b3-tooltips__n${isMobile() ? "" : " fn__size200"}">
-    <input style="box-sizing: border-box" value="${width}" class="b3-slider fn__block" max="100" min="1" step="1" type="range">
+                    label: `<div style="margin: 4px 0;" aria-label="${imgElement.style.width ? imgElement.style.width.replace("vw", "%") : window.siyuan.languages.default}" class="b3-tooltips b3-tooltips__n${isMobile() ? "" : " fn__size200"}">
+    <input style="box-sizing: border-box" value="${(imgElement.style.width.endsWith("%")||imgElement.style.width.endsWith("vw")) ? parseInt(imgElement.style.width) : 0}" class="b3-slider fn__block" max="100" min="1" step="1" type="range">
 </div>`,
                     bind(element) {
                         rangeElement = element.querySelector("input");
                         rangeElement.addEventListener("input", () => {
-                            imgElement.style.width = rangeElement.value + "vw";
+                            imgElement.style.width = rangeElement.value + "%";
                             rangeElement.parentElement.setAttribute("aria-label", `${rangeElement.value}%`);
                         });
                         rangeElement.addEventListener("change", () => {
@@ -1236,14 +1235,13 @@ export const imgMenu = (protyle: IProtyle, range: Range, assetElement: HTMLEleme
             ]
         }).element);
         let rangeHeightElement: HTMLInputElement;
-        const height = imgElement.style.height.endsWith("vh") ? parseInt(imgElement.style.height) : 0;
         window.siyuan.menus.menu.append(new MenuItem({
             label: window.siyuan.languages.height,
             submenu: [{
                 iconHTML: "",
                 type: "readonly",
                 label: `<div class="fn__flex-center">
-<input class="b3-text-field" value="${imgElement.style.height.endsWith("px") ? parseInt(imgElement.style.height) : ""}" type="number" style="margin: 4px" placeholder="${window.siyuan.languages.height}"> px
+<input class="b3-text-field" value="${imgElement.style.height.endsWith("px") ? parseInt(imgElement.style.height) : ""}" type="number" style="margin: 4px 8px 4px 0" placeholder="${window.siyuan.languages.height}">px
 </div>`,
                 bind(element) {
                     const inputElement = element.querySelector("input");
@@ -1252,7 +1250,6 @@ export const imgMenu = (protyle: IProtyle, range: Range, assetElement: HTMLEleme
                         rangeHeightElement.parentElement.setAttribute("aria-label", inputElement.value ? (inputElement.value + "px") : window.siyuan.languages.default);
 
                         imgElement.style.height = inputElement.value ? (inputElement.value + "px") : "";
-                        assetElement.style.width = "";
                         imgElement.style.width = "";
                     });
                     inputElement.addEventListener("blur", () => {
@@ -1276,13 +1273,12 @@ export const imgMenu = (protyle: IProtyle, range: Range, assetElement: HTMLEleme
                 }, {
                     iconHTML: "",
                     type: "readonly",
-                    label: `<div style="margin: 4px 0;" aria-label="${imgElement.style.height.endsWith("vh") ? parseInt(imgElement.style.height) + "%" : (imgElement.style.height || window.siyuan.languages.default)}" class="b3-tooltips b3-tooltips__n${isMobile() ? "" : " fn__size200"}">
-    <input style="box-sizing: border-box" value="${height}" class="b3-slider fn__block" max="100" min="1" step="1" type="range">
+                    label: `<div style="margin: 4px 0;" aria-label="${imgElement.style.height ? imgElement.style.height.replace("vh", "%") : window.siyuan.languages.default}" class="b3-tooltips b3-tooltips__n${isMobile() ? "" : " fn__size200"}">
+    <input style="box-sizing: border-box" value="${imgElement.style.height.endsWith("vh") ? parseInt(imgElement.style.height) : 0}" class="b3-slider fn__block" max="100" min="1" step="1" type="range">
 </div>`,
                     bind(element) {
                         rangeHeightElement = element.querySelector("input");
                         rangeHeightElement.addEventListener("input", () => {
-                            assetElement.style.width = "";
                             imgElement.style.width = "";
                             imgElement.style.height = rangeHeightElement.value + "vh";
                             rangeHeightElement.parentElement.setAttribute("aria-label", `${rangeHeightElement.value}%`);
@@ -1823,11 +1819,7 @@ const genImageWidthMenu = (label: string, imgElement: HTMLElement, protyle: IPro
         label,
         click() {
             nodeElement.setAttribute("updated", dayjs().format("YYYYMMDDHHmmss"));
-            if (label === window.siyuan.languages.default) {
-                imgElement.style.width = "";
-            } else {
-                imgElement.style.width = label.replace("%", "vw");
-            }
+            imgElement.style.width = label === window.siyuan.languages.default ? "" : label;
             imgElement.style.height = "";
             updateTransaction(protyle, id, nodeElement.outerHTML, html);
             focusBlock(nodeElement);
@@ -1841,11 +1833,7 @@ const genImageHeightMenu = (label: string, imgElement: HTMLElement, protyle: IPr
         label,
         click() {
             nodeElement.setAttribute("updated", dayjs().format("YYYYMMDDHHmmss"));
-            if (label === window.siyuan.languages.default) {
-                imgElement.style.height = "";
-            } else {
-                imgElement.style.height = parseInt(label) + "vh";
-            }
+            imgElement.style.height = label === window.siyuan.languages.default ? "" : parseInt(label) + "vh";
             imgElement.style.width = "";
             updateTransaction(protyle, id, nodeElement.outerHTML, html);
             focusBlock(nodeElement);
diff --git a/app/src/protyle/wysiwyg/index.ts b/app/src/protyle/wysiwyg/index.ts
index b2656dc5a..9a227b1ff 100644
--- a/app/src/protyle/wysiwyg/index.ts
+++ b/app/src/protyle/wysiwyg/index.ts
@@ -671,7 +671,6 @@ export class WYSIWYG {
                 const dragHeight = dragElement.clientHeight;
                 documentSelf.onmousemove = (moveEvent: MouseEvent) => {
                     if (dragElement.tagName === "IMG") {
-                        dragElement.parentElement.parentElement.style.width = "";
                         dragElement.style.height = "";
                     }
                     if (moveEvent.clientX > x - dragWidth + 8 && moveEvent.clientX < mostRight) {
@@ -772,11 +771,11 @@ export class WYSIWYG {
             }
 
             // 多选节点
-            let x = event.clientX;
+            let clentX = event.clientX;
             if (event.clientX > mostRight) {
-                x = mostRight;
+                clentX = mostRight;
             } else if (event.clientX < mostLeft) {
-                x = mostLeft;
+                clentX = mostLeft;
             }
             const mostTop = rect.top + (protyle.options.render.breadcrumb ? protyle.breadcrumb.element.parentElement.clientHeight : 0);
 
@@ -880,7 +879,7 @@ export class WYSIWYG {
                 let newLeft = 0;
                 let newWidth = 0;
                 let newHeight = 0;
-                if (moveEvent.clientX < x) {
+                if (moveEvent.clientX < clentX) {
                     if (moveEvent.clientX < mostLeft) {
                         // 向左越界
                         newLeft = mostLeft;
@@ -888,16 +887,16 @@ export class WYSIWYG {
                         // 向左
                         newLeft = moveEvent.clientX;
                     }
-                    newWidth = x - newLeft;
+                    newWidth = clentX - newLeft;
                 } else {
                     if (moveEvent.clientX > mostRight) {
                         // 向右越界
-                        newLeft = x;
+                        newLeft = clentX;
                         newWidth = mostRight - newLeft;
                     } else {
                         // 向右
-                        newLeft = x;
-                        newWidth = moveEvent.clientX - x;
+                        newLeft = clentX;
+                        newWidth = moveEvent.clientX - clentX;
                     }
                 }