diff --git a/components/progress/demo/circle-mini.md b/components/progress/demo/circle-mini.md
index 3aa0678b67..9627e9326a 100644
--- a/components/progress/demo/circle-mini.md
+++ b/components/progress/demo/circle-mini.md
@@ -11,9 +11,9 @@ var Circle = antd.Progress.Circle;
 
 React.render(
   <div>
-    <Circle percent="30" width="100" />
-    <Circle percent="70" width="100" status="exception" />
-    <Circle percent="100" width="100" />
+    <Circle percent="30" width="80" />
+    <Circle percent="70" width="80" status="exception" />
+    <Circle percent="100" width="80" />
   </div>
   , document.getElementById('components-progress-demo-circle-mini'));
 ````
diff --git a/components/progress/demo/circle.md b/components/progress/demo/circle.md
index 7ef2562cd4..a8a2ef7542 100644
--- a/components/progress/demo/circle.md
+++ b/components/progress/demo/circle.md
@@ -11,9 +11,9 @@ var Circle = antd.Progress.Circle;
 
 React.render(
   <div>
-    <Circle percent="30" width="150" />
-    <Circle percent="70" width="150" status="exception" />
-    <Circle percent="100" width="150" />
+    <Circle percent="30" width="126" />
+    <Circle percent="70" width="126" status="exception" />
+    <Circle percent="100" width="126" />
   </div>
   , document.getElementById('components-progress-demo-circle'));
 ````
@@ -21,7 +21,7 @@ React.render(
 <style>
 .ant-progress-circle-wrap,
 .ant-progress-line-wrap {
-  margin-right: 15px;
-  margin-bottom: 15px;
+  margin-right: 8px;
+  margin-bottom: 5px;
 }
 </style>