diff --git a/pages/group/info.vue b/pages/group/info.vue
index 2098905756c58f2fcd6a96f398f2f52b87105ddf..ead10669b2816f57dc39de19fec94e47feee3d58 100644
--- a/pages/group/info.vue
+++ b/pages/group/info.vue
@@ -424,16 +424,9 @@
   @import "@/uni_modules/uni-im/common/baseStyle.scss";
   page,
   .group-info-box {
-    width: 750rpx;
-    flex: 1;
+    width: 100%;
+    height: 100%;
     background-color: #f5f5f5;
-    /* #ifdef H5 */
-    @media screen and (min-device-width:960px) {
-      height: calc(95vh - 70px);
-      overflow-y: auto;
-      flex: none;
-    }
-    /* #endif */
     .logo {
       width: 50px;
       height: 50px;
diff --git a/pages/index/index.scss b/pages/index/index.scss
index 2e92390201c37df686b057559ca1d97bfbf5cba9..01ee1a40c5cc517b43a186ee7fe898cc838f241d 100644
--- a/pages/index/index.scss
+++ b/pages/index/index.scss
@@ -2,6 +2,7 @@
  //   flex: 1;
  // }
 page {
+  width: 100%;
   height: 100vh;
   background-color: #2e2e3e;
   /* #ifdef H5 */
@@ -128,26 +129,29 @@ page {
               }
             }
           }
-        }
-        
-        .chatInfoBox {
-          z-index: 9;
-          position: absolute;
-          right:0;
-          top: 70px;
-          background-color: rgba(0,0,0,0.2);
-          height: calc(95vh - 70px);
-          align-items: flex-end;
-          width: 100%;
-          .group-info-text {
-            max-width: 250px !important;
-            text-align: left;
-            word-break: break-all;
+          .chatInfoBox {
+            z-index: 9;
+            position: absolute;
+            right:0;
+            background-color: rgba(0,0,0,0.2);
+            height: 100%;
+            width: 100%;
+            align-items: flex-end;
+            .group-info-parent{
+              height: 100%;
+              overflow-y: auto;
+              background-color: #f5f5f5;
+            }
+            .group-info-text {
+              max-width: 250px !important;
+              text-align: left;
+              word-break: break-all;
+            }
           }
         }
       }
       #ccid-is-null-tip {
-        height: 95vh;
+        flex: 1;
         padding-top: 30vh;
         align-items: center;
         background-color: #efefef;
diff --git a/pages/index/index.vue b/pages/index/index.vue
index fa4f8f7f037b2f963c42e0b9906288a041d8f599..b25e65f60da0b52b3e3cfa9babd95d133930f0e3 100644
--- a/pages/index/index.vue
+++ b/pages/index/index.vue
@@ -74,14 +74,17 @@
             <view class="header">
             	<uni-icons @click="showChatInfo" class="more" type="more-filled" size="20"></uni-icons>
             </view>
-            <chat-view class="content" ref="chat-view"></chat-view>
-					</template>
-					<view v-if="chatInfoIsShow" class="chatInfoBox" @click.stop="chatInfoIsShow = false">
-            <view @click.native.stop>
-              <uni-im-group-info v-if="currentConversation.group_id" ref="group-info"></uni-im-group-info>
-              <uni-im-chat-info v-else ref="chat-info"></uni-im-chat-info>
+            <view class="content">
+              <chat-view ref="chat-view"></chat-view>
+              <view v-if="chatInfoIsShow" class="chatInfoBox" @click.stop="chatInfoIsShow = false">
+                <view @click.stop class="group-info-parent">
+                  <uni-im-group-info v-if="currentConversation.group_id" ref="group-info"></uni-im-group-info>
+                  <uni-im-chat-info v-else ref="chat-info"></uni-im-chat-info>
+                </view>
+              </view>
             </view>
-					</view>
+					</template>
+					
 				</template>
     
 				<view v-else id="ccid-is-null-tip">