diff --git a/src/components/Home.vue b/src/components/Home.vue
index 2c33576..c3f038e 100644
--- a/src/components/Home.vue
+++ b/src/components/Home.vue
@@ -1,6 +1,6 @@
 <template>
-    <div id="ball"></div>
     <div class="container">
+        <div id="ball" class="pconly"></div>
         <div id="main">
             <div id="title"> WordIn</div>
             <div class="colbox">
@@ -92,11 +92,8 @@ export default {
     .button {
         margin-top: 30px;
     }
-    #ball{
-        width: 750px;
-        height: 750px;
-        top: -20%;
-        right: -90%;
+    .container{
+        overflow: hidden;
     }
 }
 
diff --git a/src/components/Recite.vue b/src/components/Recite.vue
index 08f926e..3ba224c 100644
--- a/src/components/Recite.vue
+++ b/src/components/Recite.vue
@@ -27,24 +27,26 @@
                 </el-checkbox-group>
             </div>
         </div>
-        <div id="rangeselect" class="card item">
-            <div class="title" style="font-size: 35px;">在线词库</div>
-            <el-checkbox v-model="online.checkAll" :indeterminate="online.isIndeterminate"
-                @change="(res) => { handleCheckAllChange(online, res) }" size="large">全选</el-checkbox>
-            <el-checkbox-group v-model="online.checkedSets" @change="(res) => { handleChange(online, res) }">
-                <div class="set_radios" v-for="(set, set_name) in online_sets" :key="set_name">
-                    <div class="subtitle">{{ set_name }}</div>
-                    <div v-for="(book, book_name) in set" :key="book_name">
-                        <p>{{ book_name }}</p>
-                        <el-checkbox class="checkbox" v-for="(config, id) in book" :key="id" :label="id" size="large"
-                            border>
-                            <div style="font-size: 18px;font-weight: 500;">
-                                {{ config.name }}
-                            </div>
-                        </el-checkbox>
+        <div class="rowbox item">
+            <div id="rangeselect" class="card">
+                <div class="title" style="font-size: 35px;">在线词库</div>
+                <el-checkbox v-model="online.checkAll" :indeterminate="online.isIndeterminate"
+                    @change="(res) => { handleCheckAllChange(online, res) }" size="large">全选</el-checkbox>
+                <el-checkbox-group v-model="online.checkedSets" @change="(res) => { handleChange(online, res) }">
+                    <div class="set_radios" v-for="(set, set_name) in online_sets" :key="set_name">
+                        <div class="subtitle">{{ set_name }}</div>
+                        <div v-for="(book, book_name) in set" :key="book_name">
+                            <p>{{ book_name }}</p>
+                            <el-checkbox class="checkbox" v-for="(config, id) in book" :key="id" :label="id" size="large"
+                                border>
+                                <div style="font-size: 18px;font-weight: 500;">
+                                    {{ config.name }}
+                                </div>
+                            </el-checkbox>
+                        </div>
                     </div>
-                </div>
-            </el-checkbox-group>
+                </el-checkbox-group>
+            </div>
         </div>
     </div>
     <div id="test" class="colbox" v-if="mode === 1">
@@ -468,9 +470,16 @@ export default {
         min-height: 50px;
         height: 55px;
     }
-    .card{
+
+    .card {
         box-shadow: none;
     }
+
+    .checkbox {
+        font-size: 30px;
+        margin-bottom: 10px;
+        margin-right: 15px;
+    }
 }
 
 @media screen and (min-width: 500px) {
@@ -526,6 +535,11 @@ export default {
         min-height: 100px;
         height: 100px;
     }
+
+    .checkbox {
+        font-size: 30px;
+        margin-bottom: 10px;
+    }
 }
 
 .subtitle {
@@ -535,11 +549,6 @@ export default {
     font-weight: 800;
 }
 
-.checkbox {
-    font-size: 30px;
-    margin-bottom: 10px;
-}
-
 #status {
     font-size: 20px;
 }
@@ -574,4 +583,5 @@ export default {
 #online-set-container {
     height: auto;
     overflow-y: auto;
-}</style>
\ No newline at end of file
+}
+</style>
\ No newline at end of file