diff --git a/webui/src/web-components/sketch-monaco-view.ts b/webui/src/web-components/sketch-monaco-view.ts
index f93b03b..cae5aca 100644
--- a/webui/src/web-components/sketch-monaco-view.ts
+++ b/webui/src/web-components/sketch-monaco-view.ts
@@ -266,6 +266,7 @@
       /* Remove absolute positioning - use normal block layout */
       position: relative;
       display: block;
+      box-sizing: border-box; /* Include border in width calculation */
     }
 
     /* Comment indicator and box styles */
@@ -1190,7 +1191,8 @@
           setTimeout(() => {
             if (this.editor && this.container.value) {
               // Use explicit dimensions to ensure Monaco uses full available space
-              const width = this.container.value.offsetWidth;
+              // Use clientWidth instead of offsetWidth to avoid border overflow
+              const width = this.container.value.clientWidth;
               this.editor.layout({
                 width: width,
                 height: maxHeight,
@@ -1237,8 +1239,9 @@
             this.fitEditorToContent();
           } else {
             // Fallback: just trigger a layout with current container dimensions
-            const width = this.container.value.offsetWidth;
-            const height = this.container.value.offsetHeight;
+            // Use clientWidth/Height instead of offsetWidth/Height to avoid border overflow
+            const width = this.container.value.clientWidth;
+            const height = this.container.value.clientHeight;
             this.editor.layout({ width, height });
           }
         }