diff --git a/polaris-react/src/components/Modal/Modal.module.scss b/polaris-react/src/components/Modal/Modal.module.scss
index 47188e0a512..cf2228c2c8a 100644
--- a/polaris-react/src/components/Modal/Modal.module.scss
+++ b/polaris-react/src/components/Modal/Modal.module.scss
@@ -2,6 +2,15 @@
 
 $small-width: 620px;
 
+.Body,
+.NoScrollBody {
+  flex-grow: 1;
+
+  @media #{$p-breakpoints-md-up} {
+    flex-grow: unset;
+  }
+}
+
 .Body {
   width: 100%;
 }
diff --git a/polaris-react/src/components/Modal/Modal.tsx b/polaris-react/src/components/Modal/Modal.tsx
index f204421e157..573256cfccc 100644
--- a/polaris-react/src/components/Modal/Modal.tsx
+++ b/polaris-react/src/components/Modal/Modal.tsx
@@ -169,9 +169,11 @@ export const Modal: React.FunctionComponent<ModalProps> & {
     );
 
     const scrollContainerMarkup = noScroll ? (
-      <Box width="100%" overflowX="hidden" overflowY="hidden">
-        {body}
-      </Box>
+      <div className={styles.NoScrollBody}>
+        <Box width="100%" overflowX="hidden" overflowY="hidden">
+          {body}
+        </Box>
+      </div>
     ) : (
       <Scrollable
         shadow