diff --git a/website/src/components/DiffEditorMonaco.tsx b/website/src/components/DiffEditorMonaco.tsx
index d675f51316f2..dfb65a1bd32f 100644
--- a/website/src/components/DiffEditorMonaco.tsx
+++ b/website/src/components/DiffEditorMonaco.tsx
@@ -113,7 +113,10 @@ export default function DiffEditor({ sides, fallback }: DiffMonacoProps) {
                     onMount={handleDiffMount}
                     height={height}
                     theme={MONACO_THEME}
-                    loading={fallback}
+                    // diffLoading lets the loading box take the static diff's height
+                    loading={
+                      <div className={styles.diffLoading}>{fallback}</div>
+                    }
                     // Prevent "TextModel got disposed before DiffEditorWidget model got reset" error
                     // by not letting @monaco-editor/react manage model disposal
                     keepCurrentOriginalModel
diff --git a/website/src/components/Playground/styles.module.css b/website/src/components/Playground/styles.module.css
index 5ee9547132eb..762fbb6d215c 100644
--- a/website/src/components/Playground/styles.module.css
+++ b/website/src/components/Playground/styles.module.css
@@ -1457,6 +1457,11 @@ div.fixtureJson + div.fixtureJson {
 .playgroundEditor > section {
   position: auto !important;
 }
+/* The section's inline height is Monaco's estimate; the static diff shown
+   while it loads wraps and has title bars, so let it keep its own height */
+.playgroundEditor > section:has(.diffLoading) {
+  height: auto !important;
+}
 
 /* Side by side when the playground itself has enough width (docs sidebar
    no longer forces an incorrect stack on homepage/blog): a grid, the file