diff --git a/src/components/buttons/ha-call-service-button.ts b/src/components/buttons/ha-call-service-button.ts
index 1476ebcffc..f7e2715a60 100644
--- a/src/components/buttons/ha-call-service-button.ts
+++ b/src/components/buttons/ha-call-service-button.ts
@@ -1,5 +1,5 @@
 import type { TemplateResult } from "lit";
-import { LitElement, html } from "lit";
+import { css, LitElement, html } from "lit";
 import { customElement, property } from "lit/decorators";
 import type { HassServiceTarget } from "home-assistant-js-websocket";
 import { showConfirmationDialog } from "../../dialogs/generic/show-dialog-box";
@@ -81,6 +81,12 @@ class HaCallServiceButton extends LitElement {
       this._callService();
     }
   }
+
+  static styles = css`
+    :host {
+      --ha-button-text-align: start;
+    }
+  `;
 }
 
 declare global {
diff --git a/src/components/ha-button.ts b/src/components/ha-button.ts
index 5ccbcadd14..ebe3e9f037 100644
--- a/src/components/ha-button.ts
+++ b/src/components/ha-button.ts
@@ -16,12 +16,14 @@ export class HaButton extends Button {
       }
       .mdc-button {
         height: var(--button-height, 36px);
+        text-align: var(--ha-button-text-align, center);
       }
       .trailing-icon {
         display: flex;
       }
       .slot-container {
         overflow: var(--button-slot-container-overflow, visible);
+        width: 100%;
       }
       :host([destructive]) {
         --mdc-theme-primary: var(--error-color);