diff --git a/core/src/components/modal/modal.tsx b/core/src/components/modal/modal.tsx
index a2b1e7a39e..c135844c89 100644
--- a/core/src/components/modal/modal.tsx
+++ b/core/src/components/modal/modal.tsx
@@ -255,7 +255,7 @@ export class Modal implements ComponentInterface, OverlayInterface {
         aria-modal="true"
         class={{
           [mode]: true,
-          [`modal-card`]: this.presentingElement !== undefined,
+          [`modal-card`]: this.presentingElement !== undefined && mode === 'ios',
           ...getClassMap(this.cssClass)
         }}
         style={{
diff --git a/core/src/css/core.scss b/core/src/css/core.scss
index 08976059e9..3bf9c421ff 100644
--- a/core/src/css/core.scss
+++ b/core/src/css/core.scss
@@ -35,7 +35,7 @@ body.backdrop-no-scroll {
 // The card style does not reach all the way to
 // the top of the screen, so there does not need
 // to be any safe area padding added
-ion-modal.modal-card .ion-page > ion-header > ion-toolbar:first-child {
+html.ios ion-modal.modal-card .ion-page > ion-header > ion-toolbar:first-child {
   padding-top: 0px;
 }