diff --git a/core/src/components/modal/modal.ios.scss b/core/src/components/modal/modal.ios.scss
index dc83c5cfbe..0a4dc10c21 100644
--- a/core/src/components/modal/modal.ios.scss
+++ b/core/src/components/modal/modal.ios.scss
@@ -21,14 +21,14 @@
 
 @media screen and (max-width: 767px) {
   @supports (width: max(0px, 1px)) {
-    :host(.modal-card) .modal-wrapper {
-      height: calc(100% - max(30px, var(--ion-safe-area-top)) - 10px);
+    :host(.modal-card) {
+      --height: calc(100% - max(30px, var(--ion-safe-area-top)) - 10px);
     }
   }
 
   @supports not (width: max(0px, 1px)) {
-    :host(.modal-card) .modal-wrapper {
-      height: calc(100% - 40px);
+    :host(.modal-card) {
+      --height: calc(100% - 40px);
     }
   }