diff --git a/docs/CHANGELOG.md b/docs/CHANGELOG.md
index 0e48546ad..429dac24e 100644
--- a/docs/CHANGELOG.md
+++ b/docs/CHANGELOG.md
@@ -19,6 +19,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 ### Fixed
 
 - Button spacing on application page
+- Checkmark not aligning with checkbox on smaller screens
 - Checkmark appearing on dropdown lists due to z-index
 - Job interest dropdown colours
 
diff --git a/src/shared/Form/FormikElements/Checkbox.tsx b/src/shared/Form/FormikElements/Checkbox.tsx
index c769ae37d..3bfc41043 100644
--- a/src/shared/Form/FormikElements/Checkbox.tsx
+++ b/src/shared/Form/FormikElements/Checkbox.tsx
@@ -39,8 +39,8 @@ const CheckboxContainer = styled.div`
     transform: rotate(45deg);
     position: relative;
     left: 25px;
+    top: 3px;
     z-index: 1;
-    top: 6px;
     display: inline-block;
     cursor: pointer;
   }
@@ -86,11 +86,13 @@ const FormikCheckbox: React.StatelessComponent<ICheckboxProps & FieldProps> = ({
         >
           <LabelText label={labelElement} required={required} />
           <CheckboxContainer>
-            <span className="checkmark">
-              <div className="checkmark_stem" />
-              <div className="checkmark_kick" />
-            </span>
-            <Checkbox {...field} checked={field.value} />
+            <Flex>
+              <span className="checkmark">
+                <div className="checkmark_stem" />
+                <div className="checkmark_kick" />
+              </span>
+              <Checkbox {...field} checked={field.value} />
+            </Flex>
           </CheckboxContainer>
         </Flex>
       </Label>