diff --git a/src/components/ha-dialog.ts b/src/components/ha-dialog.ts
index 2b87e25cfa..41d65bc602 100644
--- a/src/components/ha-dialog.ts
+++ b/src/components/ha-dialog.ts
@@ -5,7 +5,7 @@ import "./ha-icon-button";
 import { css, CSSResult, customElement, html } from "lit-element";
 import type { Constructor, HomeAssistant } from "../types";
 import { mdiClose } from "@mdi/js";
-import { computeRTL } from "../common/util/compute_rtl";
+import { computeRTLDirection } from "../common/util/compute_rtl";
 
 const MwcDialog = customElements.get("mwc-dialog") as Constructor<Dialog>;
 
@@ -14,8 +14,8 @@ export const createCloseHeading = (hass: HomeAssistant, title: string) => html`
   <mwc-icon-button
     aria-label=${hass.localize("ui.dialogs.generic.close")}
     dialogAction="close"
-    ?rtl=${computeRTL(hass)}
     class="header_button"
+    dir=${computeRTLDirection(hass)}
   >
     <ha-svg-icon path=${mdiClose}></ha-svg-icon>
   </mwc-icon-button>
@@ -61,7 +61,7 @@ export class HaDialog extends MwcDialog {
           text-decoration: none;
           color: inherit;
         }
-        mwc-icon-button[rtl].header_button {
+        [dir="rtl"].header_button {
           right: auto;
           left: 16px;
         }
diff --git a/src/panels/lovelace/editor/card-editor/hui-dialog-edit-card.ts b/src/panels/lovelace/editor/card-editor/hui-dialog-edit-card.ts
index 8f2a96d072..0186f24508 100755
--- a/src/panels/lovelace/editor/card-editor/hui-dialog-edit-card.ts
+++ b/src/panels/lovelace/editor/card-editor/hui-dialog-edit-card.ts
@@ -30,6 +30,7 @@ import "./hui-card-preview";
 import type { EditCardDialogParams } from "./show-edit-card-dialog";
 import { getCardDocumentationURL } from "../get-card-documentation-url";
 import { mdiHelpCircle } from "@mdi/js";
+import { computeRTLDirection } from "../../../../common/util/compute_rtl";
 import { HassDialog } from "../../../../dialogs/make-dialog-manager";
 import { showConfirmationDialog } from "../../../../dialogs/generic/show-dialog-box";
 
@@ -118,9 +119,13 @@ export class HuiDialogEditCard extends LitElement implements HassDialog {
 
     let heading: string;
     if (this._cardConfig && this._cardConfig.type) {
-      heading = `${this.hass!.localize(
-        `ui.panel.lovelace.editor.card.${this._cardConfig.type}.name`
-      )} ${this.hass!.localize("ui.panel.lovelace.editor.edit_card.header")}`;
+      heading = this.hass!.localize(
+        "ui.panel.lovelace.editor.edit_card.typed_header",
+        "type",
+        this.hass!.localize(
+          `ui.panel.lovelace.editor.card.${this._cardConfig.type}.name`
+        )
+      );
     } else if (!this._cardConfig) {
       heading = this._viewConfig.title
         ? this.hass!.localize(
@@ -151,6 +156,7 @@ export class HuiDialogEditCard extends LitElement implements HassDialog {
                 title=${this.hass!.localize("ui.panel.lovelace.menu.help")}
                 target="_blank"
                 rel="noreferrer"
+                dir=${computeRTLDirection(this.hass)}
               >
                 <mwc-icon-button>
                   <ha-svg-icon path=${mdiHelpCircle}></ha-svg-icon>
diff --git a/src/translations/en.json b/src/translations/en.json
index 516d7cb605..52a236e6ac 100755
--- a/src/translations/en.json
+++ b/src/translations/en.json
@@ -1901,6 +1901,7 @@
           },
           "edit_card": {
             "header": "Card Configuration",
+            "typed_header": "{type} Card Configuration",
             "pick_card": "Which card would you like to add?",
             "pick_card_view_title": "Which card would you like to add to your {name} view?",
             "toggle_editor": "Toggle Editor",