diff --git a/components/spin/__tests__/__snapshots__/demo.test.js.snap b/components/spin/__tests__/__snapshots__/demo.test.js.snap
index 7d52b91d7b..026cf1db52 100644
--- a/components/spin/__tests__/__snapshots__/demo.test.js.snap
+++ b/components/spin/__tests__/__snapshots__/demo.test.js.snap
@@ -96,15 +96,19 @@ exports[`renders ./components/spin/demo/nested.md correctly 1`] = `
       </div>
     </div>
   </div>
-  Loading state：
-  <span
-    class="ant-switch"
-    tabindex="0"
+  <div
+    style="margin-top:16px;"
   >
+    Loading state：
     <span
-      class="ant-switch-inner"
-    />
-  </span>
+      class="ant-switch"
+      tabindex="0"
+    >
+      <span
+        class="ant-switch-inner"
+      />
+    </span>
+  </div>
 </div>
 `;
 
diff --git a/components/spin/demo/nested.md b/components/spin/demo/nested.md
index 4c361905c9..767aa48de3 100644
--- a/components/spin/demo/nested.md
+++ b/components/spin/demo/nested.md
@@ -21,18 +21,19 @@ class Card extends React.Component {
   toggle = (value) => {
     this.setState({ loading: value });
   }
-  render() {
-    const container = (
-      <Alert
-        message="Alert message title"
-        description="Further details about the context of this alert."
-        type="info"
-      />
-    );
+  render() {  
     return (
       <div>
-        <Spin spinning={this.state.loading}>{container}</Spin>
-        Loading state：<Switch checked={this.state.loading} onChange={this.toggle} />
+        <Spin spinning={this.state.loading}>
+          <Alert
+            message="Alert message title"
+            description="Further details about the context of this alert."
+            type="info"
+          />
+        </Spin>
+        <div style={{ marginTop: 16 }}>
+          Loading state：<Switch checked={this.state.loading} onChange={this.toggle} />
+        </div>
       </div>
     );
   }