From 5d35f529685a3238abd96ec03dfd60a36f0136d2 Mon Sep 17 00:00:00 2001
From: ayang <473033518@qq.com>
Date: Tue, 13 May 2025 19:41:25 +0800
Subject: [PATCH] fix(slider): fix incorrect placement of dots and marker text

---
 components/vc-slider/src/common/Marks.tsx |  3 ++-
 components/vc-slider/src/common/Steps.tsx | 14 ++++++++++++--
 2 files changed, 14 insertions(+), 3 deletions(-)

diff --git a/components/vc-slider/src/common/Marks.tsx b/components/vc-slider/src/common/Marks.tsx
index 286b3c3238..d11c41090c 100644
--- a/components/vc-slider/src/common/Marks.tsx
+++ b/components/vc-slider/src/common/Marks.tsx
@@ -40,7 +40,8 @@ const Marks = (_: any, { attrs, slots }: any) => {
       });
 
       const bottomStyle = {
-        marginBottom: '-50%',
+        transform: `translateY(${reverse ? `-50%` : `50%`})`,
+        msTransform: `translateY(${reverse ? `-50%` : `50%`})`,
         [reverse ? 'top' : 'bottom']: `${((point - min) / range) * 100}%`,
       };
 
diff --git a/components/vc-slider/src/common/Steps.tsx b/components/vc-slider/src/common/Steps.tsx
index 793a35ec43..28f62857f9 100644
--- a/components/vc-slider/src/common/Steps.tsx
+++ b/components/vc-slider/src/common/Steps.tsx
@@ -53,8 +53,18 @@ const Steps = (_: any, { attrs }) => {
       (!included && point === upperBound) ||
       (included && point <= upperBound && point >= lowerBound);
     let style = vertical
-      ? { ...dotStyle, [reverse ? 'top' : 'bottom']: offset }
-      : { ...dotStyle, [reverse ? 'right' : 'left']: offset };
+      ? {
+          ...dotStyle,
+          [reverse ? 'top' : 'bottom']: offset,
+          transform: `translateY(${reverse ? '-50%' : '50%'})`,
+          msTransform: `translateY(${reverse ? '-50%' : '50%'})`,
+        }
+      : {
+          ...dotStyle,
+          [reverse ? 'right' : 'left']: offset,
+          transform: `translateX(${reverse ? '50%' : '-50%'})`,
+          msTransform: `translateX(${reverse ? '50%' : '-50%'})`,
+        };
     if (isActived) {
       style = { ...style, ...activeDotStyle };
     }