diff --git a/packages/ui-react/src/page/initValue.ts b/packages/ui-react/src/page/initValue.ts
index 21dc884a..7d370f58 100644
--- a/packages/ui-react/src/page/initValue.ts
+++ b/packages/ui-react/src/page/initValue.ts
@@ -16,4 +16,10 @@
  * limitations under the License.
  */
 
-export default {};
+export default {
+  items: [],
+  style: {
+    width: '100%',
+    height: '100%',
+  },
+};
diff --git a/packages/ui-vue2/src/page/initValue.ts b/packages/ui-vue2/src/page/initValue.ts
index 21dc884a..7d370f58 100644
--- a/packages/ui-vue2/src/page/initValue.ts
+++ b/packages/ui-vue2/src/page/initValue.ts
@@ -16,4 +16,10 @@
  * limitations under the License.
  */
 
-export default {};
+export default {
+  items: [],
+  style: {
+    width: '100%',
+    height: '100%',
+  },
+};
diff --git a/packages/ui/src/page/src/initValue.ts b/packages/ui/src/page/src/initValue.ts
index ffd14b82..7d370f58 100644
--- a/packages/ui/src/page/src/initValue.ts
+++ b/packages/ui/src/page/src/initValue.ts
@@ -19,7 +19,7 @@
 export default {
   items: [],
   style: {
-    width: '375',
-    height: '728',
+    width: '100%',
+    height: '100%',
   },
 };
diff --git a/runtime/react/src/page/App.css b/runtime/react/src/page/App.css
index ee47fa00..12634385 100644
--- a/runtime/react/src/page/App.css
+++ b/runtime/react/src/page/App.css
@@ -1,8 +1,11 @@
-#root {
-  width: fit-content;
-  position: relative;
-  margin: 0 auto;
+html,
+body,
+#app {
+  width: 100%;
+  height: 100%;
 }
-::-webkit-scrollbar {
-  width: 0;
+
+#app {
+  position: relative;
+  overflow: auto;
 }
\ No newline at end of file
diff --git a/runtime/react/src/playground/App.css b/runtime/react/src/playground/App.css
index 592e01b6..e6768580 100644
--- a/runtime/react/src/playground/App.css
+++ b/runtime/react/src/playground/App.css
@@ -1,11 +1,19 @@
-#root {
-  width: fit-content;
-  position: relative;
-  margin: 0 auto;
+html,
+body,
+#app {
+  width: 100%;
+  height: 100%;
 }
-::-webkit-scrollbar {
+
+#app {
+  position: relative;
+  overflow: auto;
+}
+
+#app::-webkit-scrollbar {
   width: 0;
 }
+
 .magic-ui-container {
   background-color: rgba(136, 136, 136, 0.5);
 }
diff --git a/runtime/vue2/src/page/App.vue b/runtime/vue2/src/page/App.vue
index 84e923f4..d5b10442 100644
--- a/runtime/vue2/src/page/App.vue
+++ b/runtime/vue2/src/page/App.vue
@@ -22,12 +22,15 @@ export default defineComponent({
 </script>
 
 <style lang="scss">
+html,
+body,
 #app {
-  width: fit-content;
-  position: relative;
-  margin: 0 auto;
+  width: 100%;
+  height: 100%;
 }
-::-webkit-scrollbar {
-  width: 0;
+
+#app {
+  position: relative;
+  overflow: auto;
 }
 </style>
diff --git a/runtime/vue2/src/playground/App.vue b/runtime/vue2/src/playground/App.vue
index caeb6e8d..bbd0acf5 100644
--- a/runtime/vue2/src/playground/App.vue
+++ b/runtime/vue2/src/playground/App.vue
@@ -133,6 +133,22 @@ export default Vue.extend({
 </script>
 
 <style lang="scss">
+html,
+body,
+#app {
+  width: 100%;
+  height: 100%;
+}
+
+#app {
+  position: relative;
+  overflow: auto;
+
+  &::-webkit-scrollbar {
+    width: 0;
+  }
+}
+
 .magic-ui-container {
   background-color: rgba(136, 136, 136, 0.5);
 }
diff --git a/runtime/vue3/src/page/App.vue b/runtime/vue3/src/page/App.vue
index 1c1d06ae..af020504 100644
--- a/runtime/vue3/src/page/App.vue
+++ b/runtime/vue3/src/page/App.vue
@@ -22,12 +22,15 @@ export default defineComponent({
 </script>
 
 <style lang="scss">
+html,
+body,
 #app {
-  width: fit-content;
-  position: relative;
-  margin: 0 auto;
+  width: 100%;
+  height: 100%;
 }
-::-webkit-scrollbar {
-  width: 0;
+
+#app {
+  position: relative;
+  overflow: auto;
 }
 </style>
diff --git a/runtime/vue3/src/playground/App.vue b/runtime/vue3/src/playground/App.vue
index 0af19d65..77060ee3 100644
--- a/runtime/vue3/src/playground/App.vue
+++ b/runtime/vue3/src/playground/App.vue
@@ -110,6 +110,22 @@ export default defineComponent({
 </script>
 
 <style lang="scss">
+html,
+body,
+#app {
+  width: 100%;
+  height: 100%;
+}
+
+#app {
+  position: relative;
+  overflow: auto;
+
+  &::-webkit-scrollbar {
+    width: 0;
+  }
+}
+
 .magic-ui-container {
   background-color: rgba(136, 136, 136, 0.5);
 }