From 85d0c4b8978924a6824a7c9405dd9adb0f78db04 Mon Sep 17 00:00:00 2001
From: xiaoxia <xiaoxia@xiaoxiajianji.com>
Date: Tue, 25 Aug 2026 11:59:17 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E9=A2=84=E8=A7=88=E9=9D=A2=E6=9D=BF?=
 =?UTF-8?q?=E5=AE=B9=E5=99=A8=E9=AB=98=E5=BA=A6=E5=A1=8C=E9=99=B7=20?=
 =?UTF-8?q?=E2=80=94=20CSS=E5=8A=A0=E9=AB=98=E5=BA=A6=E7=BA=A6=E6=9D=9F=20?=
 =?UTF-8?q?+=20=E9=A2=84=E8=A7=88=E5=8C=BA=E5=8A=A0minHeight/=E8=83=8C?=
 =?UTF-8?q?=E6=99=AF?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

.xx-generate-layout 加 min-height: 500px
.xx-generate-right-col 加 height: 100% + min-height: 500px
FrontendPreviewPlayer 容器加 minHeight:400 + background:#000 +
borderRadius:8 + overflow:hidden，确保 absolute 子元素有明确尺寸锚定
---
 .../generate/components/FrontendPreviewPlayer.tsx    | 12 +++++++++++-
 apps/web/src/pages/generate/generate.css             |  3 +++
 2 files changed, 14 insertions(+), 1 deletion(-)

diff --git a/apps/web/src/pages/generate/components/FrontendPreviewPlayer.tsx b/apps/web/src/pages/generate/components/FrontendPreviewPlayer.tsx
index a9424111c..74dcec059 100644
--- a/apps/web/src/pages/generate/components/FrontendPreviewPlayer.tsx
+++ b/apps/web/src/pages/generate/components/FrontendPreviewPlayer.tsx
@@ -343,7 +343,17 @@ const FrontendPreviewPlayer: React.FC<FrontendPreviewPlayerProps> = ({
   }
 
   return (
-    <div style={{ position: "relative", width: "100%", height: "100%" }}>
+    <div
+      style={{
+        position: "relative",
+        width: "100%",
+        height: "100%",
+        minHeight: 400,
+        background: "#000",
+        borderRadius: 8,
+        overflow: "hidden",
+      }}
+    >
       {/* ── Canvas 渲染层（WebCodecs 路径） ── */}
       {effectiveUseWebCodecs && (
         <div
diff --git a/apps/web/src/pages/generate/generate.css b/apps/web/src/pages/generate/generate.css
index ecae6e027..5b388f54f 100644
--- a/apps/web/src/pages/generate/generate.css
+++ b/apps/web/src/pages/generate/generate.css
@@ -111,6 +111,7 @@
   grid-template-columns: 1fr 320px;
   gap: 24px;
   align-items: start;
+  min-height: 500px;
 }
 
 /* ============================================================
@@ -2526,6 +2527,8 @@
   display: flex;
   flex-direction: column;
   gap: 16px;
+  height: 100%;
+  min-height: 500px;
 }
 
 .xx-preview-header {
-- 
2.54.0