diff --git a/src/components/atoms/OakIcon/OakIcon.tsx b/src/components/atoms/OakIcon/OakIcon.tsx
index d164f672..7335faf2 100644
--- a/src/components/atoms/OakIcon/OakIcon.tsx
+++ b/src/components/atoms/OakIcon/OakIcon.tsx
@@ -44,6 +44,8 @@ export const OakIcon = (props: OakIconProps) => {
       alt={alt ?? iconName}
       $width={$width}
       $height={$height}
+      $minHeight={$width}
+      $minWidth={$height}
       placeholder="empty"
       // Icons should not be optimised since the SVG is already as small as it can be and should be served directly
       unoptimized
diff --git a/src/components/atoms/OakIcon/__snapshots__/OakIcon.test.tsx.snap b/src/components/atoms/OakIcon/__snapshots__/OakIcon.test.tsx.snap
index 0fc1b524..3ca9c6ce 100644
--- a/src/components/atoms/OakIcon/__snapshots__/OakIcon.test.tsx.snap
+++ b/src/components/atoms/OakIcon/__snapshots__/OakIcon.test.tsx.snap
@@ -4,7 +4,9 @@ exports[`OakIcon matches snapshot 1`] = `
 .c0 {
   position: relative;
   width: 2rem;
+  min-width: 2rem;
   height: 2rem;
+  min-height: 2rem;
   font-family: Lexend,sans-serif;
 }
 
diff --git a/src/components/molecules/InternalShadowRectButton/__snapshots__/InternalShadowRectButton.test.tsx.snap b/src/components/molecules/InternalShadowRectButton/__snapshots__/InternalShadowRectButton.test.tsx.snap
index 6ca1eb56..3d7f1ccb 100644
--- a/src/components/molecules/InternalShadowRectButton/__snapshots__/InternalShadowRectButton.test.tsx.snap
+++ b/src/components/molecules/InternalShadowRectButton/__snapshots__/InternalShadowRectButton.test.tsx.snap
@@ -25,7 +25,9 @@ exports[`InternalShadowRectButton matches snapshot 1`] = `
 .c7 {
   position: relative;
   width: 1.5rem;
+  min-width: 1.5rem;
   height: 1.5rem;
+  min-height: 1.5rem;
   font-family: Lexend,sans-serif;
 }
 
diff --git a/src/components/molecules/InternalShadowRoundButton/__snapshots__/InternalShadowRoundButton.test.tsx.snap b/src/components/molecules/InternalShadowRoundButton/__snapshots__/InternalShadowRoundButton.test.tsx.snap
index 7ca8bb38..0857bb4f 100644
--- a/src/components/molecules/InternalShadowRoundButton/__snapshots__/InternalShadowRoundButton.test.tsx.snap
+++ b/src/components/molecules/InternalShadowRoundButton/__snapshots__/InternalShadowRoundButton.test.tsx.snap
@@ -36,7 +36,9 @@ exports[`InternalShadowRoundButton matches snapshot 1`] = `
 .c9 {
   position: relative;
   width: 1.5rem;
+  min-width: 1.5rem;
   height: 1.5rem;
+  min-height: 1.5rem;
   font-family: Lexend,sans-serif;
 }
 
diff --git a/src/components/molecules/OakBackLink/__snapshots__/OakBackLink.test.tsx.snap b/src/components/molecules/OakBackLink/__snapshots__/OakBackLink.test.tsx.snap
index 93caf9ad..498b1f46 100644
--- a/src/components/molecules/OakBackLink/__snapshots__/OakBackLink.test.tsx.snap
+++ b/src/components/molecules/OakBackLink/__snapshots__/OakBackLink.test.tsx.snap
@@ -4,7 +4,9 @@ exports[`OakBackLink matches snapshot 1`] = `
 .c1 {
   position: relative;
   width: 2.5rem;
+  min-width: 2.5rem;
   height: 2.5rem;
+  min-height: 2.5rem;
   font-family: Lexend,sans-serif;
 }
 
diff --git a/src/components/molecules/OakCheckBox/__snapshots__/OakCheckbox.test.tsx.snap b/src/components/molecules/OakCheckBox/__snapshots__/OakCheckbox.test.tsx.snap
index b11f8008..5b0bc8d6 100644
--- a/src/components/molecules/OakCheckBox/__snapshots__/OakCheckbox.test.tsx.snap
+++ b/src/components/molecules/OakCheckBox/__snapshots__/OakCheckbox.test.tsx.snap
@@ -48,7 +48,9 @@ exports[`OakCheckBox matches snapshot 1`] = `
 .c10 {
   position: relative;
   width: 100%;
+  min-width: 100%;
   height: 100%;
+  min-height: 100%;
   font-family: Lexend,sans-serif;
 }
 
diff --git a/src/components/molecules/OakDragAndDropInstructions/__snapshots__/OakDragAndDropInstructions.test.tsx.snap b/src/components/molecules/OakDragAndDropInstructions/__snapshots__/OakDragAndDropInstructions.test.tsx.snap
index 0aee83e9..eb06dc54 100644
--- a/src/components/molecules/OakDragAndDropInstructions/__snapshots__/OakDragAndDropInstructions.test.tsx.snap
+++ b/src/components/molecules/OakDragAndDropInstructions/__snapshots__/OakDragAndDropInstructions.test.tsx.snap
@@ -8,7 +8,9 @@ exports[`OakDragAndDropInstructions matches snapshot 1`] = `
 .c3 {
   position: relative;
   width: 2rem;
+  min-width: 2rem;
   height: 2rem;
+  min-height: 2rem;
   font-family: Lexend,sans-serif;
 }
 
diff --git a/src/components/molecules/OakDraggable/__snapshots__/OakDraggable.test.tsx.snap b/src/components/molecules/OakDraggable/__snapshots__/OakDraggable.test.tsx.snap
index 30c96305..ac2a3cf0 100644
--- a/src/components/molecules/OakDraggable/__snapshots__/OakDraggable.test.tsx.snap
+++ b/src/components/molecules/OakDraggable/__snapshots__/OakDraggable.test.tsx.snap
@@ -20,7 +20,9 @@ exports[`OakDraggable matches snapshot 1`] = `
 .c5 {
   position: relative;
   width: 2rem;
+  min-width: 2rem;
   height: 2rem;
+  min-height: 2rem;
   font-family: Lexend,sans-serif;
 }
 
diff --git a/src/components/molecules/OakDraggableFeedback/__snapshots__/OakDraggableFeedback.test.tsx.snap b/src/components/molecules/OakDraggableFeedback/__snapshots__/OakDraggableFeedback.test.tsx.snap
index 22852818..7bd3ddda 100644
--- a/src/components/molecules/OakDraggableFeedback/__snapshots__/OakDraggableFeedback.test.tsx.snap
+++ b/src/components/molecules/OakDraggableFeedback/__snapshots__/OakDraggableFeedback.test.tsx.snap
@@ -22,7 +22,9 @@ exports[`OakDraggableFeedback matches snapshot 1`] = `
 .c5 {
   position: relative;
   width: 2rem;
+  min-width: 2rem;
   height: 2rem;
+  min-height: 2rem;
   font-family: Lexend,sans-serif;
 }
 
diff --git a/src/components/molecules/OakHandDrawnCardWithIcon/__snapshots__/OakHandDrawnCardWithIcon.test.tsx.snap b/src/components/molecules/OakHandDrawnCardWithIcon/__snapshots__/OakHandDrawnCardWithIcon.test.tsx.snap
index 4b1059fe..f027e4d6 100644
--- a/src/components/molecules/OakHandDrawnCardWithIcon/__snapshots__/OakHandDrawnCardWithIcon.test.tsx.snap
+++ b/src/components/molecules/OakHandDrawnCardWithIcon/__snapshots__/OakHandDrawnCardWithIcon.test.tsx.snap
@@ -23,7 +23,9 @@ exports[`OakHandDrawnCardWithIcon matches snapshot 1`] = `
 .c6 {
   position: relative;
   width: 4rem;
+  min-width: 4rem;
   height: 4rem;
+  min-height: 4rem;
   font-family: Lexend,sans-serif;
 }
 
@@ -82,12 +84,24 @@ exports[`OakHandDrawnCardWithIcon matches snapshot 1`] = `
   }
 }
 
+@media (min-width:750px) {
+  .c6 {
+    min-width: 7.5rem;
+  }
+}
+
 @media (min-width:750px) {
   .c6 {
     height: 7.5rem;
   }
 }
 
+@media (min-width:750px) {
+  .c6 {
+    min-height: 7.5rem;
+  }
+}
+
 <div
   className="c0 c1"
 >
diff --git a/src/components/molecules/OakLessonInfoCard/__snapshots__/OakLessonInfoCard.test.tsx.snap b/src/components/molecules/OakLessonInfoCard/__snapshots__/OakLessonInfoCard.test.tsx.snap
index ee7c019b..f1d10f5f 100644
--- a/src/components/molecules/OakLessonInfoCard/__snapshots__/OakLessonInfoCard.test.tsx.snap
+++ b/src/components/molecules/OakLessonInfoCard/__snapshots__/OakLessonInfoCard.test.tsx.snap
@@ -15,7 +15,9 @@ exports[`OakLessonInfoCard component test matches snapshot 1`] = `
 .c4 {
   position: relative;
   width: 2rem;
+  min-width: 2rem;
   height: 2rem;
+  min-height: 2rem;
   font-family: Lexend,sans-serif;
 }
 
diff --git a/src/components/molecules/OakPrimaryButton/__snapshots__/OakPrimaryButton.test.tsx.snap b/src/components/molecules/OakPrimaryButton/__snapshots__/OakPrimaryButton.test.tsx.snap
index d9d6658f..7c4fa017 100644
--- a/src/components/molecules/OakPrimaryButton/__snapshots__/OakPrimaryButton.test.tsx.snap
+++ b/src/components/molecules/OakPrimaryButton/__snapshots__/OakPrimaryButton.test.tsx.snap
@@ -25,7 +25,9 @@ exports[`OakPrimaryButton matches snapshot 1`] = `
 .c7 {
   position: relative;
   width: 1.5rem;
+  min-width: 1.5rem;
   height: 1.5rem;
+  min-height: 1.5rem;
   font-family: Lexend,sans-serif;
 }
 
diff --git a/src/components/molecules/OakPrimaryInvertedButton/__snapshots__/OakPrimaryInvertedButton.test.tsx.snap b/src/components/molecules/OakPrimaryInvertedButton/__snapshots__/OakPrimaryInvertedButton.test.tsx.snap
index 9775b514..68e90bba 100644
--- a/src/components/molecules/OakPrimaryInvertedButton/__snapshots__/OakPrimaryInvertedButton.test.tsx.snap
+++ b/src/components/molecules/OakPrimaryInvertedButton/__snapshots__/OakPrimaryInvertedButton.test.tsx.snap
@@ -25,7 +25,9 @@ exports[`OakPrimaryInvertedButton matches snapshot 1`] = `
 .c7 {
   position: relative;
   width: 1.5rem;
+  min-width: 1.5rem;
   height: 1.5rem;
+  min-height: 1.5rem;
   font-family: Lexend,sans-serif;
 }
 
diff --git a/src/components/molecules/OakRoundIcon/__snapshots__/OakRoundIcon.test.tsx.snap b/src/components/molecules/OakRoundIcon/__snapshots__/OakRoundIcon.test.tsx.snap
index 6a453cba..c31ebb3a 100644
--- a/src/components/molecules/OakRoundIcon/__snapshots__/OakRoundIcon.test.tsx.snap
+++ b/src/components/molecules/OakRoundIcon/__snapshots__/OakRoundIcon.test.tsx.snap
@@ -13,7 +13,9 @@ exports[`OakRoundIcon matches snapshot 1`] = `
 .c1 {
   position: relative;
   width: 100%;
+  min-width: 100%;
   height: 100%;
+  min-height: 100%;
   font-family: Lexend,sans-serif;
 }
 
diff --git a/src/components/molecules/OakSecondaryButton/__snapshots__/OakSecondaryButton.test.tsx.snap b/src/components/molecules/OakSecondaryButton/__snapshots__/OakSecondaryButton.test.tsx.snap
index 5a01f8c3..45eed220 100644
--- a/src/components/molecules/OakSecondaryButton/__snapshots__/OakSecondaryButton.test.tsx.snap
+++ b/src/components/molecules/OakSecondaryButton/__snapshots__/OakSecondaryButton.test.tsx.snap
@@ -25,7 +25,9 @@ exports[`OakSecondaryButton matches snapshot 1`] = `
 .c7 {
   position: relative;
   width: 1.5rem;
+  min-width: 1.5rem;
   height: 1.5rem;
+  min-height: 1.5rem;
   font-family: Lexend,sans-serif;
 }
 
diff --git a/src/components/organisms/pupil/OakHintButton/__snapshots__/OakHintButton.test.tsx.snap b/src/components/organisms/pupil/OakHintButton/__snapshots__/OakHintButton.test.tsx.snap
index 7c4faee5..51a27c61 100644
--- a/src/components/organisms/pupil/OakHintButton/__snapshots__/OakHintButton.test.tsx.snap
+++ b/src/components/organisms/pupil/OakHintButton/__snapshots__/OakHintButton.test.tsx.snap
@@ -36,7 +36,9 @@ exports[`OakHintButton matches snapshot 1`] = `
 .c10 {
   position: relative;
   width: 1.5rem;
+  min-width: 1.5rem;
   height: 1.5rem;
+  min-height: 1.5rem;
   font-family: Lexend,sans-serif;
 }
 
diff --git a/src/components/organisms/pupil/OakLessonBottomNav/__snapshots__/OakLessonBottomNav.test.tsx.snap b/src/components/organisms/pupil/OakLessonBottomNav/__snapshots__/OakLessonBottomNav.test.tsx.snap
index 5770b0db..d8da57f3 100644
--- a/src/components/organisms/pupil/OakLessonBottomNav/__snapshots__/OakLessonBottomNav.test.tsx.snap
+++ b/src/components/organisms/pupil/OakLessonBottomNav/__snapshots__/OakLessonBottomNav.test.tsx.snap
@@ -54,7 +54,9 @@ exports[`OakLessonBottomNav matches snapshot 1`] = `
 .c16 {
   position: relative;
   width: 1.5rem;
+  min-width: 1.5rem;
   height: 1.5rem;
+  min-height: 1.5rem;
   font-family: Lexend,sans-serif;
 }
 
@@ -359,7 +361,9 @@ exports[`OakLessonBottomNav matches snapshot 1`] = `
 .c7 {
   position: relative;
   width: 100%;
+  min-width: 100%;
   height: 100%;
+  min-height: 100%;
   font-family: Lexend,sans-serif;
 }
 
@@ -551,7 +555,9 @@ exports[`OakLessonBottomNav matches snapshot 1`] = `
 .c7 {
   position: relative;
   width: 100%;
+  min-width: 100%;
   height: 100%;
+  min-height: 100%;
   font-family: Lexend,sans-serif;
 }
 
@@ -761,7 +767,9 @@ exports[`OakLessonBottomNav matches snapshot 1`] = `
 .c7 {
   position: relative;
   width: 100%;
+  min-width: 100%;
   height: 100%;
+  min-height: 100%;
   font-family: Lexend,sans-serif;
 }
 
diff --git a/src/components/organisms/pupil/OakLessonNavItem/__snapshots__/OakLessonNavItem.test.tsx.snap b/src/components/organisms/pupil/OakLessonNavItem/__snapshots__/OakLessonNavItem.test.tsx.snap
index d0a8707b..82545144 100644
--- a/src/components/organisms/pupil/OakLessonNavItem/__snapshots__/OakLessonNavItem.test.tsx.snap
+++ b/src/components/organisms/pupil/OakLessonNavItem/__snapshots__/OakLessonNavItem.test.tsx.snap
@@ -23,7 +23,9 @@ exports[`OakLessonNavItem matches snapshot 1`] = `
 .c5 {
   position: relative;
   width: 3.5rem;
+  min-width: 3.5rem;
   height: 3.5rem;
+  min-height: 3.5rem;
   font-family: Lexend,sans-serif;
 }
 
@@ -66,7 +68,9 @@ exports[`OakLessonNavItem matches snapshot 1`] = `
 .c14 {
   position: relative;
   width: 100%;
+  min-width: 100%;
   height: 100%;
+  min-height: 100%;
   font-family: Lexend,sans-serif;
 }
 
diff --git a/src/components/organisms/pupil/OakLessonReviewItem/__snapshots__/OakPupilLessonReviewItem.test.tsx.snap b/src/components/organisms/pupil/OakLessonReviewItem/__snapshots__/OakPupilLessonReviewItem.test.tsx.snap
index af0c7ef3..0d0bae45 100644
--- a/src/components/organisms/pupil/OakLessonReviewItem/__snapshots__/OakPupilLessonReviewItem.test.tsx.snap
+++ b/src/components/organisms/pupil/OakLessonReviewItem/__snapshots__/OakPupilLessonReviewItem.test.tsx.snap
@@ -26,7 +26,9 @@ exports[`OakLessonReviewItem matches snapshot 1`] = `
 .c4 {
   position: relative;
   width: 100%;
+  min-width: 100%;
   height: 100%;
+  min-height: 100%;
   font-family: Lexend,sans-serif;
 }
 
diff --git a/src/components/organisms/pupil/OakLessonTopNav/__snapshots__/OakLessonTopNav.test.tsx.snap b/src/components/organisms/pupil/OakLessonTopNav/__snapshots__/OakLessonTopNav.test.tsx.snap
index a9dd3fc5..4616994a 100644
--- a/src/components/organisms/pupil/OakLessonTopNav/__snapshots__/OakLessonTopNav.test.tsx.snap
+++ b/src/components/organisms/pupil/OakLessonTopNav/__snapshots__/OakLessonTopNav.test.tsx.snap
@@ -13,7 +13,9 @@ exports[`OakLessonTopNav matches snapshot 1`] = `
 .c4 {
   position: relative;
   width: 2.5rem;
+  min-width: 2.5rem;
   height: 2.5rem;
+  min-height: 2.5rem;
   font-family: Lexend,sans-serif;
 }
 
@@ -29,7 +31,9 @@ exports[`OakLessonTopNav matches snapshot 1`] = `
 .c8 {
   position: relative;
   width: 100%;
+  min-width: 100%;
   height: 100%;
+  min-height: 100%;
   font-family: Lexend,sans-serif;
 }
 
diff --git a/src/components/organisms/pupil/OakLessonVideoTranscript/__snapshots__/OakLessonVideoTranscript.test.tsx.snap b/src/components/organisms/pupil/OakLessonVideoTranscript/__snapshots__/OakLessonVideoTranscript.test.tsx.snap
index 073f773f..3e240246 100644
--- a/src/components/organisms/pupil/OakLessonVideoTranscript/__snapshots__/OakLessonVideoTranscript.test.tsx.snap
+++ b/src/components/organisms/pupil/OakLessonVideoTranscript/__snapshots__/OakLessonVideoTranscript.test.tsx.snap
@@ -37,7 +37,9 @@ exports[`OakLessonVideoTranscript matches snapshot 1`] = `
 .c11 {
   position: relative;
   width: 1.5rem;
+  min-width: 1.5rem;
   height: 1.5rem;
+  min-height: 1.5rem;
   font-family: Lexend,sans-serif;
 }
 
diff --git a/src/components/organisms/pupil/OakQuizFeedback/__snapshots__/OakQuizFeedback.test.tsx.snap b/src/components/organisms/pupil/OakQuizFeedback/__snapshots__/OakQuizFeedback.test.tsx.snap
index b4fa2a09..c6e48451 100644
--- a/src/components/organisms/pupil/OakQuizFeedback/__snapshots__/OakQuizFeedback.test.tsx.snap
+++ b/src/components/organisms/pupil/OakQuizFeedback/__snapshots__/OakQuizFeedback.test.tsx.snap
@@ -18,7 +18,9 @@ exports[`OakQuizFeedback matches snapshot 1`] = `
 .c3 {
   position: relative;
   width: 100%;
+  min-width: 100%;
   height: 100%;
+  min-height: 100%;
   font-family: Lexend,sans-serif;
 }
 
@@ -118,7 +120,9 @@ exports[`OakQuizFeedback matches snapshot 1`] = `
 .c3 {
   position: relative;
   width: 100%;
+  min-width: 100%;
   height: 100%;
+  min-height: 100%;
   font-family: Lexend,sans-serif;
 }
 
@@ -236,7 +240,9 @@ exports[`OakQuizFeedback matches snapshot 1`] = `
 .c3 {
   position: relative;
   width: 100%;
+  min-width: 100%;
   height: 100%;
+  min-height: 100%;
   font-family: Lexend,sans-serif;
 }
 
diff --git a/src/components/organisms/pupil/OakQuizHint/__snapshots__/OakQuizHint.test.tsx.snap b/src/components/organisms/pupil/OakQuizHint/__snapshots__/OakQuizHint.test.tsx.snap
index 0d52868c..c7de449d 100644
--- a/src/components/organisms/pupil/OakQuizHint/__snapshots__/OakQuizHint.test.tsx.snap
+++ b/src/components/organisms/pupil/OakQuizHint/__snapshots__/OakQuizHint.test.tsx.snap
@@ -48,7 +48,9 @@ exports[`OakQuizHint matches snapshot 1`] = `
 .c12 {
   position: relative;
   width: 1.5rem;
+  min-width: 1.5rem;
   height: 1.5rem;
+  min-height: 1.5rem;
   font-family: Lexend,sans-serif;
 }
 
diff --git a/src/components/organisms/pupil/OakQuizMatch/__snapshots__/OakQuizMatch.test.tsx.snap b/src/components/organisms/pupil/OakQuizMatch/__snapshots__/OakQuizMatch.test.tsx.snap
index 150da921..0a9a570a 100644
--- a/src/components/organisms/pupil/OakQuizMatch/__snapshots__/OakQuizMatch.test.tsx.snap
+++ b/src/components/organisms/pupil/OakQuizMatch/__snapshots__/OakQuizMatch.test.tsx.snap
@@ -14,7 +14,9 @@ exports[`OakQuizMatch matches snapshot 1`] = `
 .c4 {
   position: relative;
   width: 2rem;
+  min-width: 2rem;
   height: 2rem;
+  min-height: 2rem;
   font-family: Lexend,sans-serif;
 }
 
@@ -168,7 +170,9 @@ exports[`OakQuizMatch matches snapshot 1`] = `
 .c9 {
   position: relative;
   width: 2rem;
+  min-width: 2rem;
   height: 2rem;
+  min-height: 2rem;
   font-family: Lexend,sans-serif;
 }
 
diff --git a/src/components/organisms/pupil/OakQuizOrder/__snapshots__/OakQuizOrder.test.tsx.snap b/src/components/organisms/pupil/OakQuizOrder/__snapshots__/OakQuizOrder.test.tsx.snap
index 0a964ff8..c27f40e7 100644
--- a/src/components/organisms/pupil/OakQuizOrder/__snapshots__/OakQuizOrder.test.tsx.snap
+++ b/src/components/organisms/pupil/OakQuizOrder/__snapshots__/OakQuizOrder.test.tsx.snap
@@ -14,7 +14,9 @@ exports[`OakQuizOrder matches snapshot 1`] = `
 .c4 {
   position: relative;
   width: 2rem;
+  min-width: 2rem;
   height: 2rem;
+  min-height: 2rem;
   font-family: Lexend,sans-serif;
 }
 
@@ -168,7 +170,9 @@ exports[`OakQuizOrder matches snapshot 1`] = `
 .c12 {
   position: relative;
   width: 2rem;
+  min-width: 2rem;
   height: 2rem;
+  min-height: 2rem;
   font-family: Lexend,sans-serif;
 }