diff --git a/core/src/components/badge/test/hint/index.html b/core/src/components/badge/test/hint/index.html
index fba0d6e73f..0a2ce00d08 100644
--- a/core/src/components/badge/test/hint/index.html
+++ b/core/src/components/badge/test/hint/index.html
@@ -366,6 +366,38 @@
+
+
+ Inside Tab Button - Only Icon
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 999
+
+
+
+
+
+
+
+
+
+
Inside Button - Top Placement
diff --git a/core/src/components/tab-button/tab-button.ionic.scss b/core/src/components/tab-button/tab-button.ionic.scss
index d3751e5862..e04b75d9c1 100644
--- a/core/src/components/tab-button/tab-button.ionic.scss
+++ b/core/src/components/tab-button/tab-button.ionic.scss
@@ -7,6 +7,11 @@
:host {
--focus-ring-color: #{globals.$ion-border-focus-default};
--focus-ring-width: #{globals.$ion-border-radius-025};
+ --padding-top: #{globals.$ion-space-100};
+ --padding-end: #{globals.$ion-space-400};
+ --padding-bottom: #{globals.$ion-space-100};
+ --padding-start: #{globals.$ion-space-400};
+
@include globals.typography(globals.$ion-body-action-xs);
@@ -48,6 +53,7 @@
.button-native {
min-width: globals.$ion-scale-1200;
+ min-height: globals.$ion-scale-1200;
overflow: visible;
@@ -108,10 +114,6 @@
@include globals.position(-2px);
}
-:host ::slotted(ion-badge.badge-vertical-top:empty) {
- @include globals.position(calc(globals.$ion-scale-100 * -1));
-}
-
:host ::slotted(ion-badge.badge-vertical-bottom) {
@include globals.position(calc(50% - globals.$ion-scale-200));
}