diff --git a/packages/console/src/pages/SignInExperience/index.module.scss b/packages/console/src/pages/SignInExperience/index.module.scss
index d203996bb..a72587a0e 100644
--- a/packages/console/src/pages/SignInExperience/index.module.scss
+++ b/packages/console/src/pages/SignInExperience/index.module.scss
@@ -21,14 +21,15 @@
     .contentTop {
       display: flex;
       flex: 1;
+      margin-bottom: _.unit(6);
+
+      &.withSubmitActionBar {
+        margin-bottom: _.unit(3);
+      }
 
       .form {
         flex: 1;
-        margin: 0 _.unit(3) _.unit(6) 0;
-
-        &.withSubmitActionBar {
-          margin-bottom: _.unit(3);
-        }
+        margin-right: _.unit(3);
 
         > :not(:first-child) {
           margin-top: _.unit(3);
diff --git a/packages/console/src/pages/SignInExperience/index.tsx b/packages/console/src/pages/SignInExperience/index.tsx
index 47b9052e7..13b1a0207 100644
--- a/packages/console/src/pages/SignInExperience/index.tsx
+++ b/packages/console/src/pages/SignInExperience/index.tsx
@@ -146,9 +146,9 @@ const SignInExperience = () => {
       {!data && error && <div>{`error occurred: ${error.body?.message ?? error.message}`}</div>}
       {data && defaultFormData && (
         <div className={styles.content}>
-          <div className={styles.contentTop}>
+          <div className={classNames(styles.contentTop, isDirty && styles.withSubmitActionBar)}>
             <FormProvider {...methods}>
-              <form className={classNames(styles.form, isDirty && styles.withSubmitActionBar)}>
+              <form className={styles.form}>
                 {/* Todo: LOG-4766 Add Constants To Guard Router Path */}
                 <Branding isActive={tab === 'branding'} />
                 <SignUpAndSignIn isActive={tab === 'sign-up-and-sign-in'} />