diff --git a/core/src/components/tab-bar/tab-bar.scss b/core/src/components/tab-bar/tab-bar.scss
index 8f77a12898d..e54e5f2a87b 100644
--- a/core/src/components/tab-bar/tab-bar.scss
+++ b/core/src/components/tab-bar/tab-bar.scss
@@ -22,7 +22,9 @@
   contain: strict;
   user-select: none;
   z-index: $z-index-toolbar;
-  box-sizing: content-box;
+
+  /* stylelint-disable-next-line declaration-no-important */
+  box-sizing: content-box !important;
 }
 
 :host(.ion-color) {
diff --git a/core/src/components/tabs/test/basic/index.html b/core/src/components/tabs/test/basic/index.html
index bee149f3953..76db45e1f57 100644
--- a/core/src/components/tabs/test/basic/index.html
+++ b/core/src/components/tabs/test/basic/index.html
@@ -8,6 +8,12 @@
   <link href="../../../../../css/ionic.bundle.css" rel="stylesheet">
   <link href="../../../../../scripts/testing/styles.css" rel="stylesheet">
   <script src="../../../../../dist/ionic.js"></script>
+
+  <style>
+  :root {
+    --ion-safe-area-bottom: 40px;
+  }
+  </style>
 </head>
 
 <body>
