Merge pull request #1422 from albertgasset/MOBILE-2433

MOBILE-2433 core: Fix iframes in fullscreen mode

src/app/app.scss

@@ -832,3 +832,20 @@ body.keyboard-is-open core-ion-tabs .tabbar {
     pointer-events: none;
   }
 }
+
+// Fix iframes in fullscreen mode.
+//
+// Ionic sets "contain: strict" to some elements. This enables paint containment,
+// which changes behaviour of fixed positioned elements and seems to break iframes
+// in fullscreen mode. See https://www.w3.org/TR/css-contain-1/#containment-paint
+ion-app,
+ion-nav,
+ion-tab,
+ion-tabs,
+.app-root,
+.ion-page,
+ion-modal,
+.modal-wrapper,
+.split-pane {
+  contain: size layout style;
+}

src/components/ion-tabs/ion-tabs.scss

@@ -43,7 +43,9 @@ core-ion-tabs, core-ion-tab {
     width: 100%;
     height: 100%;
     overflow: hidden;
-    contain: strict;
+
+    // Do not use "contain: strict" so fullscreen iframes work.
+    contain: size layout style;
 }
 
 core-ion-tab {