diff --git a/packages/varlet-ui/src/slider/docs/en-US.md b/packages/varlet-ui/src/slider/docs/en-US.md
index 9989195afbf..90d4e4846ba 100644
--- a/packages/varlet-ui/src/slider/docs/en-US.md
+++ b/packages/varlet-ui/src/slider/docs/en-US.md
@@ -112,10 +112,11 @@ The props such as `label-visible`, `label-text-color`, `thumb-size` are invalid
 ```
 ```css
 .slider-example_block {
-  width: 25px;
+  width: 24px;
   border: 1px solid #52af77;
   color: #52af77;
-  height: 25px;
+  height: 24px;
+  margin: 0 -12px;
   display: flex;
   align-items: center;
   justify-content: center;
diff --git a/packages/varlet-ui/src/slider/docs/zh-CN.md b/packages/varlet-ui/src/slider/docs/zh-CN.md
index fb9e456c022..45742d78769 100644
--- a/packages/varlet-ui/src/slider/docs/zh-CN.md
+++ b/packages/varlet-ui/src/slider/docs/zh-CN.md
@@ -113,10 +113,11 @@ export default {
 ```
 ```css
 .slider-example_block {
-  width: 25px;
+  width: 24px;
   border: 1px solid #52af77;
   color: #52af77;
-  height: 25px;
+  height: 24px;
+  margin: 0 -12px;
   display: flex;
   align-items: center;
   justify-content: center;
diff --git a/packages/varlet-ui/src/slider/example/index.vue b/packages/varlet-ui/src/slider/example/index.vue
index 9b39ad12da5..a6410255530 100644
--- a/packages/varlet-ui/src/slider/example/index.vue
+++ b/packages/varlet-ui/src/slider/example/index.vue
@@ -97,10 +97,11 @@ export default {
 </script>
 <style lang="less" scoped>
 .slider-example_block {
-  width: 25px;
+  width: 24px;
   border: 1px solid #52af77;
   color: #52af77;
-  height: 25px;
+  height: 24px;
+  margin: 0 -12px;
   display: flex;
   align-items: center;
   justify-content: center;