diff --git a/packages/console/src/components/Transfer/DraggableItem.tsx b/packages/console/src/components/Transfer/DraggableItem.tsx
index c64a05f0f..98682f662 100644
--- a/packages/console/src/components/Transfer/DraggableItem.tsx
+++ b/packages/console/src/components/Transfer/DraggableItem.tsx
@@ -11,6 +11,7 @@ type Props = {
   sortIndex: number;
   moveItem: (dragIndex: number, hoverIndex: number) => void;
   children: ReactNode;
+  className?: string;
 };
 
 type DragItemProps = {
@@ -21,7 +22,7 @@ type DragItemProps = {
 
 const dragType = 'TransferItem';
 
-const DraggableItem = ({ id, children, sortIndex, moveItem }: Props) => {
+const DraggableItem = ({ id, children, sortIndex, moveItem, className }: Props) => {
   const ref = useRef<HTMLDivElement>(null);
   const { setIsDragging } = useContext(DragDropContext);
   const [{ handlerId }, drop] = useDrop<DragItemProps, void, { handlerId: Nullable<Identifier> }>({
@@ -99,7 +100,7 @@ const DraggableItem = ({ id, children, sortIndex, moveItem }: Props) => {
   }, [setIsDragging, isDragging]);
 
   return (
-    <div ref={ref} style={{ opacity }} data-handler-id={handlerId}>
+    <div ref={ref} style={{ opacity }} data-handler-id={handlerId} className={className}>
       {children}
     </div>
   );
diff --git a/packages/console/src/pages/SignInExperience/tabs/SignUpAndSignInTab/components/SignInMethodEditBox/index.module.scss b/packages/console/src/pages/SignInExperience/tabs/SignUpAndSignInTab/components/SignInMethodEditBox/index.module.scss
index 31111b57a..6cb490336 100644
--- a/packages/console/src/pages/SignInExperience/tabs/SignUpAndSignInTab/components/SignInMethodEditBox/index.module.scss
+++ b/packages/console/src/pages/SignInExperience/tabs/SignUpAndSignInTab/components/SignInMethodEditBox/index.module.scss
@@ -1,5 +1,9 @@
 @use '@/scss/underscore' as _;
 
+.draggleItemContainer {
+  transform: translate(0, 0);
+}
+
 .signInMethodItem {
   display: flex;
   align-items: center;
diff --git a/packages/console/src/pages/SignInExperience/tabs/SignUpAndSignInTab/components/SignInMethodEditBox/index.tsx b/packages/console/src/pages/SignInExperience/tabs/SignUpAndSignInTab/components/SignInMethodEditBox/index.tsx
index a45d8ada0..86adb772b 100644
--- a/packages/console/src/pages/SignInExperience/tabs/SignUpAndSignInTab/components/SignInMethodEditBox/index.tsx
+++ b/packages/console/src/pages/SignInExperience/tabs/SignUpAndSignInTab/components/SignInMethodEditBox/index.tsx
@@ -9,6 +9,7 @@ import { signInIdentifiers, signInIdentifierToRequiredConnectorMapping } from '.
 import ConnectorSetupWarning from '../ConnectorSetupWarning';
 import AddButton from './AddButton';
 import SignInMethodItem from './SignInMethodItem';
+import * as styles from './index.module.scss';
 import type { SignInMethod } from './types';
 import {
   computeOnSignInMethodAppended,
@@ -125,6 +126,7 @@ const SignInMethodEditBox = ({
             id={signInMethod.identifier}
             sortIndex={index}
             moveItem={onMoveItem}
+            className={styles.draggleItemContainer}
           >
             <SignInMethodItem
               signInMethod={signInMethod}
diff --git a/packages/console/src/pages/SignInExperience/tabs/SignUpAndSignInTab/components/SocialConnectorEditBox/index.module.scss b/packages/console/src/pages/SignInExperience/tabs/SignUpAndSignInTab/components/SocialConnectorEditBox/index.module.scss
index 611b534ea..ce48af402 100644
--- a/packages/console/src/pages/SignInExperience/tabs/SignUpAndSignInTab/components/SocialConnectorEditBox/index.module.scss
+++ b/packages/console/src/pages/SignInExperience/tabs/SignUpAndSignInTab/components/SocialConnectorEditBox/index.module.scss
@@ -1,5 +1,9 @@
 @use '@/scss/underscore' as _;
 
+.draggleItemContainer {
+  transform: translate(0, 0);
+}
+
 .setUpHint {
   font: var(--font-body-medium);
   color: var(--color-text-secondary);
diff --git a/packages/console/src/pages/SignInExperience/tabs/SignUpAndSignInTab/components/SocialConnectorEditBox/index.tsx b/packages/console/src/pages/SignInExperience/tabs/SignUpAndSignInTab/components/SocialConnectorEditBox/index.tsx
index 7f7b39728..c9a46050c 100644
--- a/packages/console/src/pages/SignInExperience/tabs/SignUpAndSignInTab/components/SocialConnectorEditBox/index.tsx
+++ b/packages/console/src/pages/SignInExperience/tabs/SignUpAndSignInTab/components/SocialConnectorEditBox/index.tsx
@@ -62,7 +62,13 @@ const SocialConnectorEditBox = ({ value, onChange }: Props) => {
     <div>
       <DragDropProvider>
         {selectedConnectorItems.map((item, index) => (
-          <DraggableItem key={item.id} id={item.id} sortIndex={index} moveItem={onMoveItem}>
+          <DraggableItem
+            key={item.id}
+            id={item.id}
+            sortIndex={index}
+            moveItem={onMoveItem}
+            className={styles.draggleItemContainer}
+          >
             <SelectedConnectorItem
               data={item}
               onDelete={(target) => {