diff --git a/components/avatar/__tests__/__snapshots__/demo.test.js.snap b/components/avatar/__tests__/__snapshots__/demo.test.js.snap
index 34f60465b7..2780a6c77e 100644
--- a/components/avatar/__tests__/__snapshots__/demo.test.js.snap
+++ b/components/avatar/__tests__/__snapshots__/demo.test.js.snap
@@ -200,79 +200,51 @@ exports[`renders ./components/avatar/demo/badge.md correctly 1`] = `
 
 exports[`renders ./components/avatar/demo/basic.md correctly 1`] = `
 <div>
-  <div
-    class="ant-row"
-  >
-    <div
-      class="ant-col-4"
+  <div>
+    <span
+      class="ant-avatar ant-avatar-lg ant-avatar-circle ant-avatar-icon"
     >
-      <span
-        class="ant-avatar ant-avatar-lg ant-avatar-circle ant-avatar-icon"
-      >
-        <i
-          class="anticon anticon-user"
-        />
-      </span>
-    </div>
-    <div
-      class="ant-col-4"
+      <i
+        class="anticon anticon-user"
+      />
+    </span>
+    <span
+      class="ant-avatar ant-avatar-circle ant-avatar-icon"
     >
-      <span
-        class="ant-avatar ant-avatar-circle ant-avatar-icon"
-      >
-        <i
-          class="anticon anticon-user"
-        />
-      </span>
-    </div>
-    <div
-      class="ant-col-4"
+      <i
+        class="anticon anticon-user"
+      />
+    </span>
+    <span
+      class="ant-avatar ant-avatar-sm ant-avatar-circle ant-avatar-icon"
     >
-      <span
-        class="ant-avatar ant-avatar-sm ant-avatar-circle ant-avatar-icon"
-      >
-        <i
-          class="anticon anticon-user"
-        />
-      </span>
-    </div>
+      <i
+        class="anticon anticon-user"
+      />
+    </span>
   </div>
-  <div
-    class="ant-row"
-  >
-    <div
-      class="ant-col-4"
+  <div>
+    <span
+      class="ant-avatar ant-avatar-lg ant-avatar-square ant-avatar-icon"
     >
-      <span
-        class="ant-avatar ant-avatar-lg ant-avatar-square ant-avatar-icon"
-      >
-        <i
-          class="anticon anticon-user"
-        />
-      </span>
-    </div>
-    <div
-      class="ant-col-4"
+      <i
+        class="anticon anticon-user"
+      />
+    </span>
+    <span
+      class="ant-avatar ant-avatar-square ant-avatar-icon"
     >
-      <span
-        class="ant-avatar ant-avatar-square ant-avatar-icon"
-      >
-        <i
-          class="anticon anticon-user"
-        />
-      </span>
-    </div>
-    <div
-      class="ant-col-4"
+      <i
+        class="anticon anticon-user"
+      />
+    </span>
+    <span
+      class="ant-avatar ant-avatar-sm ant-avatar-square ant-avatar-icon"
     >
-      <span
-        class="ant-avatar ant-avatar-sm ant-avatar-square ant-avatar-icon"
-      >
-        <i
-          class="anticon anticon-user"
-        />
-      </span>
-    </div>
+      <i
+        class="anticon anticon-user"
+      />
+    </span>
   </div>
 </div>
 `;
@@ -303,87 +275,55 @@ exports[`renders ./components/avatar/demo/dynamic.md correctly 1`] = `
 
 exports[`renders ./components/avatar/demo/type.md correctly 1`] = `
 <div>
-  <div
-    class="ant-row"
+  <span
+    class="ant-avatar ant-avatar-circle ant-avatar-icon"
   >
-    <div
-      class="ant-col-4"
-    >
-      <span
-        class="ant-avatar ant-avatar-circle ant-avatar-icon"
-      >
-        <i
-          class="anticon anticon-user"
-        />
-      </span>
-    </div>
-    <div
-      class="ant-col-4"
-    >
-      <span
-        class="ant-avatar ant-avatar-circle"
-      >
-        <span
-          class="ant-avatar-string"
-        >
-          U
-        </span>
-      </span>
-    </div>
-    <div
-      class="ant-col-4"
-    >
-      <span
-        class="ant-avatar ant-avatar-circle"
-      >
-        <span
-          class="ant-avatar-string"
-        >
-          USER
-        </span>
-      </span>
-    </div>
-    <div
-      class="ant-col-4"
+    <i
+      class="anticon anticon-user"
+    />
+  </span>
+  <span
+    class="ant-avatar ant-avatar-circle"
+  >
+    <span
+      class="ant-avatar-string"
     >
-      <span
-        class="ant-avatar ant-avatar-circle ant-avatar-image"
-      >
-        <img
-          src="https://os.alipayobjects.com/rmsportal/mgesTPFxodmIwpi.png"
-        />
-      </span>
-    </div>
-  </div>
-  <div
-    class="ant-row"
+      U
+    </span>
+  </span>
+  <span
+    class="ant-avatar ant-avatar-circle"
   >
-    <div
-      class="ant-col-4"
+    <span
+      class="ant-avatar-string"
     >
-      <span
-        class="ant-avatar ant-avatar-circle"
-        style="color:#f56a00;background-color:#fde3cf;"
-      >
-        <span
-          class="ant-avatar-string"
-        >
-          U
-        </span>
-      </span>
-    </div>
-    <div
-      class="ant-col-4"
+      USER
+    </span>
+  </span>
+  <span
+    class="ant-avatar ant-avatar-circle ant-avatar-image"
+  >
+    <img
+      src="https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png"
+    />
+  </span>
+  <span
+    class="ant-avatar ant-avatar-circle"
+    style="color:#f56a00;background-color:#fde3cf;"
+  >
+    <span
+      class="ant-avatar-string"
     >
-      <span
-        class="ant-avatar ant-avatar-circle ant-avatar-icon"
-        style="background-color:#87d068;"
-      >
-        <i
-          class="anticon anticon-user"
-        />
-      </span>
-    </div>
-  </div>
+      U
+    </span>
+  </span>
+  <span
+    class="ant-avatar ant-avatar-circle ant-avatar-icon"
+    style="background-color:#87d068;"
+  >
+    <i
+      class="anticon anticon-user"
+    />
+  </span>
 </div>
 `;
diff --git a/components/avatar/demo/basic.md b/components/avatar/demo/basic.md
index d67a9ac36a..c061babca3 100644
--- a/components/avatar/demo/basic.md
+++ b/components/avatar/demo/basic.md
@@ -14,20 +14,27 @@ title:
 Three sizes and two shapes are available.
 
 ````jsx
-import { Avatar, Row, Col } from 'antd';
+import { Avatar } from 'antd';
 
 ReactDOM.render(
   <div>
-    <Row>
-      <Col span={4}><Avatar size="large" icon="user" /></Col>
-      <Col span={4}><Avatar icon="user" /></Col>
-      <Col span={4}><Avatar size="small" icon="user" /></Col>
-    </Row>
-    <Row>
-      <Col span={4}><Avatar shape="square" size="large" icon="user" /></Col>
-      <Col span={4}><Avatar shape="square" icon="user" /></Col>
-      <Col span={4}><Avatar shape="square" size="small" icon="user" /></Col>
-    </Row>
+    <div>
+      <Avatar size="large" icon="user" />
+      <Avatar icon="user" />
+      <Avatar size="small" icon="user" />
+    </div>
+    <div>
+      <Avatar shape="square" size="large" icon="user" />
+      <Avatar shape="square" icon="user" />
+      <Avatar shape="square" size="small" icon="user" />
+    </div>
   </div>
 , mountNode);
 ````
+
+<style>
+#components-avatar-demo-basic .ant-avatar {
+  margin-top: 16px;
+  margin-right: 16px;
+}
+</style>
diff --git a/components/avatar/demo/type.md b/components/avatar/demo/type.md
index e24ab3386f..bd08432c20 100644
--- a/components/avatar/demo/type.md
+++ b/components/avatar/demo/type.md
@@ -14,20 +14,23 @@ title:
 Image, Icon and letter are supported, and the latter two kinds avatar can have custom colors and background colors.
 
 ````jsx
-import { Avatar, Row, Col } from 'antd';
+import { Avatar } from 'antd';
 
 ReactDOM.render(
   <div>
-    <Row>
-      <Col span={4}><Avatar icon="user" /></Col>
-      <Col span={4}><Avatar>U</Avatar></Col>
-      <Col span={4}><Avatar>USER</Avatar></Col>
-      <Col span={4}><Avatar src="https://os.alipayobjects.com/rmsportal/mgesTPFxodmIwpi.png" /></Col>
-    </Row>
-    <Row>
-      <Col span={4}><Avatar style={{ color: '#f56a00', backgroundColor: '#fde3cf' }}>U</Avatar></Col>
-      <Col span={4}><Avatar style={{ backgroundColor: '#87d068' }} icon="user" /></Col>
-    </Row>
+    <Avatar icon="user" />
+    <Avatar>U</Avatar>
+    <Avatar>USER</Avatar>
+    <Avatar src="https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png" />
+    <Avatar style={{ color: '#f56a00', backgroundColor: '#fde3cf' }}>U</Avatar>
+    <Avatar style={{ backgroundColor: '#87d068' }} icon="user" />
   </div>
 , mountNode);
 ````
+
+<style>
+#components-avatar-demo-type .ant-avatar {
+  margin-top: 16px;
+  margin-right: 16px;
+}
+</style>