diff --git a/src/components/tab-button/d-tab-button.tsx b/src/components/tab-button/d-tab-button.tsx
index ef21f63..04fc85b 100644
--- a/src/components/tab-button/d-tab-button.tsx
+++ b/src/components/tab-button/d-tab-button.tsx
@@ -32,7 +32,7 @@ export class DTabButton {
           tab={this.tab}
           href={`/${this.tab}`}
           class={{
-            'h-12 w-12 block': true,
+            'min-h-12 min-w-12 block': true,
             'text-on-alt': !this.active,
             'text-on': this.active,
           }}
diff --git a/src/components/tab-button/test/d-tab-button.spec.tsx b/src/components/tab-button/test/d-tab-button.spec.tsx
index a1ebc7f..2c21bc0 100644
--- a/src/components/tab-button/test/d-tab-button.spec.tsx
+++ b/src/components/tab-button/test/d-tab-button.spec.tsx
@@ -10,7 +10,7 @@ describe('d-tab-button', () => {
     expect(page.root).toEqualHtml(`
       <d-tab-button tab="home">
        <mock:shadow-root>
-         <ion-tab-button class="block h-12 text-on-alt w-12" href="/home" tab="home">
+         <ion-tab-button class="block min-h-12 text-on-alt min-w-12" href="/home" tab="home">
            <div class="relative w-fit">
               <d-icon icon="home" outline="" size="28"></d-icon>
             </div>