diff --git a/compiled/alipay/src/Grid/index.axml b/compiled/alipay/src/Grid/index.axml
index 6401be462..5d2b07b22 100644
--- a/compiled/alipay/src/Grid/index.axml
+++ b/compiled/alipay/src/Grid/index.axml
@@ -31,23 +31,25 @@
           ></image-icon>
         </slot>
       </view>
-      <view class="ant-grid-item-title">
-        <slot
-          name="title"
-          value="{{item}}"
-          index="{{index}}"
-        >
-          {{item.title}}
-        </slot>
-      </view>
-      <view class="ant-grid-item-description">
-        <slot
-          name="description"
-          value="{{item}}"
-          index="{{index}}"
-        >
-          {{item.description}}
-        </slot>
+      <view class="ant-grid-item-info">
+        <view class="ant-grid-item-title">
+          <slot
+            name="title"
+            value="{{item}}"
+            index="{{index}}"
+          >
+            {{item.title}}
+          </slot>
+        </view>
+        <view class="ant-grid-item-description">
+          <slot
+            name="description"
+            value="{{item}}"
+            index="{{index}}"
+          >
+            {{item.description}}
+          </slot>
+        </view>
       </view>
     </view>
   </block>
@@ -84,23 +86,25 @@
             ></image-icon>
           </slot>
         </view>
-        <view class="ant-grid-item-title">
-          <slot
-            name="title"
-            value="{{item}}"
-            index="{{index}}"
-          >
-            {{item.title}}
-          </slot>
-        </view>
-        <view class="ant-grid-item-description">
-          <slot
-            name="description"
-            value="{{item}}"
-            index="{{index}}"
-          >
-            {{item.description}}
-          </slot>
+        <view class="ant-grid-item-info">
+          <view class="ant-grid-item-title">
+            <slot
+              name="title"
+              value="{{item}}"
+              index="{{index}}"
+            >
+              {{item.title}}
+            </slot>
+          </view>
+          <view class="ant-grid-item-description">
+            <slot
+              name="description"
+              value="{{item}}"
+              index="{{index}}"
+            >
+              {{item.description}}
+            </slot>
+          </view>
         </view>
       </view>
     </block>
diff --git a/compiled/alipay/src/Grid/index.less b/compiled/alipay/src/Grid/index.less
index b5cda6787..673fa4654 100644
--- a/compiled/alipay/src/Grid/index.less
+++ b/compiled/alipay/src/Grid/index.less
@@ -47,14 +47,19 @@
       text-align: left;
       position: relative;
       min-height: @icon-size;
-      padding-left: 80 * @rpx;
+      display: flex;
+      justify-content: flex-start;
+      align-items: center;
+      flex-direction: row;
+      .@{gridPrefix}-item-info { 
+        padding-left: 16 * @rpx;
+        display: flex;
+        justify-content: center;
+        align-items: flex-start;
+        flex-direction: column;
+      }
       .@{gridPrefix}-item-img,
       .@{gridPrefix}-item-icon {
-        position: absolute;
-        left: 0;
-        top: 0;
-        bottom: 0;
-        margin: auto;
         display: flex;
         justify-content: center;
         align-items: center;
@@ -63,6 +68,11 @@
         margin-top: 0;
       }
     }
+    &-vertical {
+      .@{gridPrefix}-item-description {
+        padding-top: 4 * @rpx;
+      }
+    }
     &-columns-scroll {
       width: @columnsscroll-width;
     }
@@ -80,9 +90,9 @@
       }
     }
     &-title {
-      font-size: 26 * @rpx;
+      font-size: 30 * @rpx;
       color: @title-color;
-      line-height: 37 * @rpx;
+      line-height: 42 * @rpx;
       width: 100%;
       margin-top: 16 * @rpx;
       white-space: nowrap;
@@ -94,6 +104,7 @@
       color: @description-color;
       line-height: 33 * @rpx;
       width: 100%;
+      padding-top: 4 * @rpx;
       white-space: nowrap;
       overflow: hidden;
       text-overflow: ellipsis;
diff --git a/compiled/wechat/src/Grid/index.wxml b/compiled/wechat/src/Grid/index.wxml
index 2d1dc76ed..1fa68e8f3 100644
--- a/compiled/wechat/src/Grid/index.wxml
+++ b/compiled/wechat/src/Grid/index.wxml
@@ -25,8 +25,10 @@
           style="{{iconSize ? 'width:' + iconSize + 'px;height:' + iconSize + 'px;font-size:' + iconSize + 'px' : ''}}"
         ></image-icon>
       </view>
-      <view class="ant-grid-item-title">{{item.title}}</view>
-      <view class="ant-grid-item-description">{{item.description}}</view>
+      <view class="ant-grid-item-info">
+        <view class="ant-grid-item-title">{{item.title}}</view>
+        <view class="ant-grid-item-description">{{item.description}}</view>
+      </view>
     </view>
   </block>
 </view>
@@ -56,8 +58,10 @@
             style="{{iconSize ? 'width:' + iconSize + 'px;height:' + iconSize + 'px;font-size:' + iconSize + 'px' : ''}}"
           ></image-icon>
         </view>
-        <view class="ant-grid-item-title">{{item.title}}</view>
-        <view class="ant-grid-item-description">{{item.description}}</view>
+        <view class="ant-grid-item-info">
+          <view class="ant-grid-item-title">{{item.title}}</view>
+          <view class="ant-grid-item-description">{{item.description}}</view>
+        </view>
       </view>
     </block>
   </view>
diff --git a/compiled/wechat/src/Grid/index.wxss b/compiled/wechat/src/Grid/index.wxss
index 2b4b34c9a..64e41eecd 100644
--- a/compiled/wechat/src/Grid/index.wxss
+++ b/compiled/wechat/src/Grid/index.wxss
@@ -56,15 +56,20 @@
   text-align: left;
   position: relative;
   min-height: 28px;
-  padding-left: 40px;
+  display: flex;
+  justify-content: flex-start;
+  align-items: center;
+  flex-direction: row;
+}
+.ant-grid-item-horizontal .ant-grid-item-info {
+  padding-left: 8px;
+  display: flex;
+  justify-content: center;
+  align-items: flex-start;
+  flex-direction: column;
 }
 .ant-grid-item-horizontal .ant-grid-item-img,
 .ant-grid-item-horizontal .ant-grid-item-icon {
-  position: absolute;
-  left: 0;
-  top: 0;
-  bottom: 0;
-  margin: auto;
   display: flex;
   justify-content: center;
   align-items: center;
@@ -72,6 +77,9 @@
 .ant-grid-item-horizontal .ant-grid-item-title {
   margin-top: 0;
 }
+.ant-grid-item-vertical .ant-grid-item-description {
+  padding-top: 2px;
+}
 .ant-grid-item-columns-scroll {
   width: 65px;
 }
@@ -87,9 +95,9 @@
   height: 28px;
 }
 .ant-grid-item-title {
-  font-size: 13px;
+  font-size: 15px;
   color: #333333;
-  line-height: 18.5px;
+  line-height: 21px;
   width: 100%;
   margin-top: 8px;
   white-space: nowrap;
@@ -101,6 +109,7 @@
   color: #999999;
   line-height: 16.5px;
   width: 100%;
+  padding-top: 2px;
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
diff --git a/src/Grid/index.axml b/src/Grid/index.axml
index c716684e5..42fd711a3 100644
--- a/src/Grid/index.axml
+++ b/src/Grid/index.axml
@@ -31,29 +31,31 @@
         </slot>
         <!-- #endif -->
       </view>
-      <view class="ant-grid-item-title">
-        <!-- #if ALIPAY -->
-        <slot
-          name="title"
-          value="{{ item }}"
-          index="{{ index }}">
-        <!-- #endif -->
-          {{ item.title }}
-        <!-- #if ALIPAY -->
-        </slot>
-        <!-- #endif -->
-      </view>
-      <view class="ant-grid-item-description">
-        <!-- #if ALIPAY -->
-        <slot
-          name="description"
-          value="{{ item }}"
-          index="{{ index }}">
-        <!-- #endif -->
-          {{ item.description }}
-        <!-- #if ALIPAY -->
-        </slot>
-        <!-- #endif -->
+      <view class="ant-grid-item-info">
+        <view class="ant-grid-item-title">
+          <!-- #if ALIPAY -->
+          <slot
+            name="title"
+            value="{{ item }}"
+            index="{{ index }}">
+          <!-- #endif -->
+            {{ item.title }}
+          <!-- #if ALIPAY -->
+          </slot>
+          <!-- #endif -->
+        </view>
+        <view class="ant-grid-item-description">
+          <!-- #if ALIPAY -->
+          <slot
+            name="description"
+            value="{{ item }}"
+            index="{{ index }}">
+          <!-- #endif -->
+            {{ item.description }}
+          <!-- #if ALIPAY -->
+          </slot>
+          <!-- #endif -->
+        </view>
       </view>
     </view>
   </block>
@@ -90,29 +92,31 @@
           </slot>
           <!-- #endif -->
         </view>
-        <view class="ant-grid-item-title">
-          <!-- #if ALIPAY -->
-          <slot
-            name="title"
-            value="{{ item }}"
-            index="{{ index }}">
-          <!-- #endif -->
-            {{ item.title }}
-          <!-- #if ALIPAY -->
-          </slot>
-          <!-- #endif -->
-        </view>
-        <view class="ant-grid-item-description">
-          <!-- #if ALIPAY -->
-          <slot
-            name="description"
-            value="{{ item }}"
-            index="{{ index }}">
-          <!-- #endif -->
-            {{ item.description }}
-          <!-- #if ALIPAY -->
-          </slot>
-          <!-- #endif -->
+        <view class="ant-grid-item-info">
+          <view class="ant-grid-item-title">
+            <!-- #if ALIPAY -->
+            <slot
+              name="title"
+              value="{{ item }}"
+              index="{{ index }}">
+            <!-- #endif -->
+              {{ item.title }}
+            <!-- #if ALIPAY -->
+            </slot>
+            <!-- #endif -->
+          </view>
+          <view class="ant-grid-item-description">
+            <!-- #if ALIPAY -->
+            <slot
+              name="description"
+              value="{{ item }}"
+              index="{{ index }}">
+            <!-- #endif -->
+              {{ item.description }}
+            <!-- #if ALIPAY -->
+            </slot>
+            <!-- #endif -->
+          </view>
         </view>
       </view>
     </block>
diff --git a/src/Grid/index.less b/src/Grid/index.less
index b5cda6787..673fa4654 100644
--- a/src/Grid/index.less
+++ b/src/Grid/index.less
@@ -47,14 +47,19 @@
       text-align: left;
       position: relative;
       min-height: @icon-size;
-      padding-left: 80 * @rpx;
+      display: flex;
+      justify-content: flex-start;
+      align-items: center;
+      flex-direction: row;
+      .@{gridPrefix}-item-info { 
+        padding-left: 16 * @rpx;
+        display: flex;
+        justify-content: center;
+        align-items: flex-start;
+        flex-direction: column;
+      }
       .@{gridPrefix}-item-img,
       .@{gridPrefix}-item-icon {
-        position: absolute;
-        left: 0;
-        top: 0;
-        bottom: 0;
-        margin: auto;
         display: flex;
         justify-content: center;
         align-items: center;
@@ -63,6 +68,11 @@
         margin-top: 0;
       }
     }
+    &-vertical {
+      .@{gridPrefix}-item-description {
+        padding-top: 4 * @rpx;
+      }
+    }
     &-columns-scroll {
       width: @columnsscroll-width;
     }
@@ -80,9 +90,9 @@
       }
     }
     &-title {
-      font-size: 26 * @rpx;
+      font-size: 30 * @rpx;
       color: @title-color;
-      line-height: 37 * @rpx;
+      line-height: 42 * @rpx;
       width: 100%;
       margin-top: 16 * @rpx;
       white-space: nowrap;
@@ -94,6 +104,7 @@
       color: @description-color;
       line-height: 33 * @rpx;
       width: 100%;
+      padding-top: 4 * @rpx;
       white-space: nowrap;
       overflow: hidden;
       text-overflow: ellipsis;