diff --git a/core/src/components/datetime-button/datetime-button.scss b/core/src/components/datetime-button/datetime-button.scss
index 3a87b88128b..5336ca8589a 100644
--- a/core/src/components/datetime-button/datetime-button.scss
+++ b/core/src/components/datetime-button/datetime-button.scss
@@ -9,6 +9,8 @@
   align-items: center;
 
   justify-content: center;
+
+  min-width: 0;
 }
 
 :host button {
@@ -27,13 +29,17 @@
   color: $text-color;
 
   font-family: inherit;
-  font-size: inherit;
+  font-size: 1rem;
 
-  cursor: pointer;
+  text-overflow: ellipsis;
 
-  appearance: none;
+  white-space: nowrap;
+
+  cursor: pointer;
 
   overflow: hidden;
+
+  appearance: none;
 }
 
 :host(.time-active) #time-button,
diff --git a/core/src/components/datetime-button/test/a11y/datetime-button.e2e.ts b/core/src/components/datetime-button/test/a11y/datetime-button.e2e.ts
new file mode 100644
index 00000000000..76b3325972a
--- /dev/null
+++ b/core/src/components/datetime-button/test/a11y/datetime-button.e2e.ts
@@ -0,0 +1,69 @@
+import { expect } from '@playwright/test';
+import { configs, test } from '@utils/test/playwright';
+
+/**
+ * The tested behavior does not vary across directions/modes
+ */
+configs({ directions: ['ltr'], modes: ['ios'] }).forEach(({ title, screenshot, config }) => {
+  test.describe(title('datetime-button: font scaling'), () => {
+    test('should scale text on larger font sizes', async ({ page }) => {
+      await page.setContent(
+        `
+        <style>
+          html {
+            font-size: 28px;
+          }
+        </style>
+        <ion-datetime-button locale="en-US" datetime="datetime"></ion-datetime-button>
+        <ion-datetime id="datetime" value="2022-01-01T06:30:00" presentation="date-time"></ion-datetime>
+      `,
+        config
+      );
+
+      const datetimeButton = page.locator('ion-datetime-button');
+
+      await expect(datetimeButton).toHaveScreenshot(screenshot(`datetime-button-scale`));
+    });
+
+    test('should truncate text on larger font sizes', async ({ page }) => {
+      await page.setContent(
+        `
+        <style>
+          html {
+            font-size: 48px;
+          }
+        </style>
+        <ion-datetime-button locale="en-US" datetime="datetime"></ion-datetime-button>
+        <ion-datetime id="datetime" value="2022-01-01T06:30:00" presentation="date-time"></ion-datetime>
+      `,
+        config
+      );
+
+      const datetimeButton = page.locator('ion-datetime-button');
+
+      await expect(datetimeButton).toHaveScreenshot(screenshot(`datetime-button-scale-truncate`));
+    });
+
+    test('should truncate text on larger font sizes inside of an item', async ({ page }) => {
+      await page.setContent(
+        `
+        <style>
+          html {
+            font-size: 48px;
+          }
+        </style>
+        <ion-item>
+          <ion-label>Start Date</ion-label>
+          <ion-datetime-button locale="en-US" datetime="datetime"></ion-datetime-button>
+        </ion-item>
+        <ion-datetime id="datetime" value="2022-01-01T06:30:00" presentation="date-time"></ion-datetime>
+      `,
+        config
+      );
+
+      const datetimeButton = page.locator('ion-datetime-button');
+
+      await expect(datetimeButton).toHaveScreenshot(screenshot(`datetime-button-scale-truncate-item`));
+    });
+  });
+});
diff --git a/core/src/components/datetime-button/test/a11y/datetime-button.e2e.ts-snapshots/datetime-button-scale-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/datetime-button/test/a11y/datetime-button.e2e.ts-snapshots/datetime-button-scale-ios-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 00000000000..758507bbdd9
Binary files /dev/null and b/core/src/components/datetime-button/test/a11y/datetime-button.e2e.ts-snapshots/datetime-button-scale-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime-button/test/a11y/datetime-button.e2e.ts-snapshots/datetime-button-scale-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime-button/test/a11y/datetime-button.e2e.ts-snapshots/datetime-button-scale-ios-ltr-Mobile-Firefox-linux.png
new file mode 100644
index 00000000000..d7a4fef693e
Binary files /dev/null and b/core/src/components/datetime-button/test/a11y/datetime-button.e2e.ts-snapshots/datetime-button-scale-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime-button/test/a11y/datetime-button.e2e.ts-snapshots/datetime-button-scale-ios-ltr-Mobile-Safari-linux.png b/core/src/components/datetime-button/test/a11y/datetime-button.e2e.ts-snapshots/datetime-button-scale-ios-ltr-Mobile-Safari-linux.png
new file mode 100644
index 00000000000..3b0ff824174
Binary files /dev/null and b/core/src/components/datetime-button/test/a11y/datetime-button.e2e.ts-snapshots/datetime-button-scale-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime-button/test/a11y/datetime-button.e2e.ts-snapshots/datetime-button-scale-truncate-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/datetime-button/test/a11y/datetime-button.e2e.ts-snapshots/datetime-button-scale-truncate-ios-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 00000000000..8771a42acc0
Binary files /dev/null and b/core/src/components/datetime-button/test/a11y/datetime-button.e2e.ts-snapshots/datetime-button-scale-truncate-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime-button/test/a11y/datetime-button.e2e.ts-snapshots/datetime-button-scale-truncate-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime-button/test/a11y/datetime-button.e2e.ts-snapshots/datetime-button-scale-truncate-ios-ltr-Mobile-Firefox-linux.png
new file mode 100644
index 00000000000..bd5542a6504
Binary files /dev/null and b/core/src/components/datetime-button/test/a11y/datetime-button.e2e.ts-snapshots/datetime-button-scale-truncate-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime-button/test/a11y/datetime-button.e2e.ts-snapshots/datetime-button-scale-truncate-ios-ltr-Mobile-Safari-linux.png b/core/src/components/datetime-button/test/a11y/datetime-button.e2e.ts-snapshots/datetime-button-scale-truncate-ios-ltr-Mobile-Safari-linux.png
new file mode 100644
index 00000000000..515135ec9c2
Binary files /dev/null and b/core/src/components/datetime-button/test/a11y/datetime-button.e2e.ts-snapshots/datetime-button-scale-truncate-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime-button/test/a11y/datetime-button.e2e.ts-snapshots/datetime-button-scale-truncate-item-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/datetime-button/test/a11y/datetime-button.e2e.ts-snapshots/datetime-button-scale-truncate-item-ios-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 00000000000..6814a5d07d0
Binary files /dev/null and b/core/src/components/datetime-button/test/a11y/datetime-button.e2e.ts-snapshots/datetime-button-scale-truncate-item-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime-button/test/a11y/datetime-button.e2e.ts-snapshots/datetime-button-scale-truncate-item-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/datetime-button/test/a11y/datetime-button.e2e.ts-snapshots/datetime-button-scale-truncate-item-ios-ltr-Mobile-Firefox-linux.png
new file mode 100644
index 00000000000..964adb783c3
Binary files /dev/null and b/core/src/components/datetime-button/test/a11y/datetime-button.e2e.ts-snapshots/datetime-button-scale-truncate-item-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/datetime-button/test/a11y/datetime-button.e2e.ts-snapshots/datetime-button-scale-truncate-item-ios-ltr-Mobile-Safari-linux.png b/core/src/components/datetime-button/test/a11y/datetime-button.e2e.ts-snapshots/datetime-button-scale-truncate-item-ios-ltr-Mobile-Safari-linux.png
new file mode 100644
index 00000000000..34d6949f587
Binary files /dev/null and b/core/src/components/datetime-button/test/a11y/datetime-button.e2e.ts-snapshots/datetime-button-scale-truncate-item-ios-ltr-Mobile-Safari-linux.png differ