diff --git a/src/components/MainView.vue b/src/components/MainView.vue
index 41e203b..5c3f239 100644
--- a/src/components/MainView.vue
+++ b/src/components/MainView.vue
@@ -4,37 +4,38 @@
       <a-layout style="height: 400px;">
         <a-layout-header>Header</a-layout-header>
         <a-layout>
-          <a-layout-sider style="background-color: aliceblue;">Sider</a-layout-sider>
-          <a-layout-content>
-            <div style="display: flex;flex-direction: row;">
+          <a-layout-sider style="background-color: aliceblue;width: fit-content;">
 
-              <div ref="el2"
-                style="margin: 5%;display: flex;flex-direction: column;overflow-x:scroll;height: 350px;width: 300px;">
-                <div v-for="item in componentsList" :key="item.id"
-                  style="height: 30px;width: 300px;border: 1px solid red;">
-                  {{ item.name }}:{{ item.id }}
+            <div ref="el2" style="display: flex;flex-direction: column;height: 500px;width: 100%;">
+              <div v-for="item in componentsList" :key="item.id"
+                style="height: 30px;width: 250px;border: 1px solid red;">
+                {{ item.name }}:{{ item.id }}
+              </div>
+
+            </div>
+          </a-layout-sider>
+          <a-layout-content>
+            <div style="margin-left: 64px;">
+              <div style="display: flex;flex-direction: row;width: 100%;">
+
+                <div class="flex justify-between">
+                  <NestedFunction v-model="list"></NestedFunction>
+                  {{ list }}
                 </div>
 
               </div>
 
-              <div class="flex justify-between">
-                <NestedFunction v-model="list" class="w-full"></NestedFunction>
-                {{ list }}
+              <div style="width: 800px;height:500px">
+                动态渲染
+                <!-- <component :is="componentMapping['Rate']" v-bind="{}"/> -->
+                <DynamicComponent v-for="component in list" :key="component.id" :componentData="component">
+                  {{ component.id }}
+                </DynamicComponent>
+              </div>
+              <div>
               </div>
-
             </div>
 
-            <div style="width: 800px;height:500px">
-              动态渲染
-              <!-- <component :is="componentMapping['Rate']" v-bind="{}"/> -->
-              <DynamicComponent v-for="component in list" :key="component.id" :componentData="component">
-                {{ component.id }}
-              </DynamicComponent>
-            </div>
-            <div>
-
-
-            </div>
           </a-layout-content>
         </a-layout>
         <a-layout-footer>Footer</a-layout-footer>