diff --git a/src/pages/ConfigPage.module.scss b/src/pages/ConfigPage.module.scss
index 3bcae7a..60a24af 100644
--- a/src/pages/ConfigPage.module.scss
+++ b/src/pages/ConfigPage.module.scss
@@ -2,6 +2,10 @@
 
 .container {
   width: 100%;
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  min-height: 0;
 }
 
 .pageTitle {
@@ -21,6 +25,8 @@
   display: flex;
   flex-direction: column;
   gap: $spacing-lg;
+  flex: 1;
+  min-height: 0;
 }
 
 .searchInputWrapper {
@@ -127,7 +133,8 @@
 
 .editorWrapper {
   width: 100%;
-  height: 500px;
+  flex: 1;
+  min-height: 200px;
   border: 1px solid var(--border-color);
   border-radius: $radius-lg;
   overflow: hidden;
@@ -206,6 +213,14 @@
   }
 }
 
+.configCard {
+  display: flex;
+  flex-direction: column;
+  flex: 1;
+  min-height: 0;
+  overflow: hidden;
+}
+
 .actions {
   display: flex;
   gap: $spacing-sm;
diff --git a/src/pages/ConfigPage.tsx b/src/pages/ConfigPage.tsx
index bc082ae..7af93ea 100644
--- a/src/pages/ConfigPage.tsx
+++ b/src/pages/ConfigPage.tsx
@@ -224,7 +224,7 @@ export function ConfigPage() {
       <h1 className={styles.pageTitle}>{t('config_management.title')}</h1>
       <p className={styles.description}>{t('config_management.description')}</p>
 
-      <Card>
+      <Card className={styles.configCard}>
         <div className={styles.content}>
           {/* Editor */}
           {error && <div className="error-box">{error}</div>}