diff --git a/packages/ui/src/accounts/modals/TransferModal/TransferSignModal.tsx b/packages/ui/src/accounts/modals/TransferModal/TransferSignModal.tsx
index 6ba17ba24b..540e2a1aac 100644
--- a/packages/ui/src/accounts/modals/TransferModal/TransferSignModal.tsx
+++ b/packages/ui/src/accounts/modals/TransferModal/TransferSignModal.tsx
@@ -65,7 +65,7 @@ export function TransferSignModal({ onClose, from, amount, to, service, transact
       <ModalBody>
         <SignTransferContainer>
           <Row>
-            <TextMedium margin="xl">
+            <TextMedium margin="xl" as="div">
               You are transferring <TokenValue value={amount} /> stake from “{from.name}” account to “{to.name}”{' '}
               destination.
             </TextMedium>
diff --git a/packages/ui/src/common/components/Stepper/HorizontalStepper.tsx b/packages/ui/src/common/components/Stepper/HorizontalStepper.tsx
index b73c4055f7..03bc5122a2 100644
--- a/packages/ui/src/common/components/Stepper/HorizontalStepper.tsx
+++ b/packages/ui/src/common/components/Stepper/HorizontalStepper.tsx
@@ -1,4 +1,4 @@
-import React from 'react'
+import React, { Fragment } from 'react'
 import styled, { css } from 'styled-components'
 
 import { asStepsToRender, StepperStep, StepToRender } from '@/common/components/Stepper/types'
@@ -16,15 +16,15 @@ export const HorizontalStepper = ({ steps }: HorizontalStepperProps) => {
   return (
     <HorizontalStepperWrapper>
       {stepsToRender.map((step, index) => (
-        <>
-          <Step step={step} key={`horizontal-stepper-${index}`}>
+        <Fragment key={`horizontal-stepper-${index}`}>
+          <Step step={step}>
             <StepCircle>{step.isPast ? <CheckboxIcon /> : index + 1}</StepCircle>
             <StepBody>
               <StepTitle>{step.title}</StepTitle>
             </StepBody>
           </Step>
           {index < stepsToRender.length - 1 && <Separator />}
-        </>
+        </Fragment>
       ))}
     </HorizontalStepperWrapper>
   )