diff --git a/src/components/chart/ha-chart-base.ts b/src/components/chart/ha-chart-base.ts
index b5656fad04..8bda2bfba8 100644
--- a/src/components/chart/ha-chart-base.ts
+++ b/src/components/chart/ha-chart-base.ts
@@ -701,7 +701,7 @@ export class HaChartBase extends LitElement {
     .chart-legend {
       max-height: 60%;
       overflow-y: auto;
-      margin: 12px 0 0;
+      padding: 12px 0 0;
       font-size: 12px;
       color: var(--primary-text-color);
     }
diff --git a/src/panels/lovelace/cards/hui-history-graph-card.ts b/src/panels/lovelace/cards/hui-history-graph-card.ts
index 8da9b69191..65847c5ad0 100644
--- a/src/panels/lovelace/cards/hui-history-graph-card.ts
+++ b/src/panels/lovelace/cards/hui-history-graph-card.ts
@@ -261,6 +261,7 @@ export class HuiHistoryGraphCard extends LitElement implements LovelaceCard {
           class="content ${classMap({
             "has-header": !!this._config.title,
             "has-rows": !!this._config.grid_options?.rows,
+            "has-height": hasFixedHeight,
           })}"
         >
           ${this._error
@@ -320,9 +321,11 @@ export class HuiHistoryGraphCard extends LitElement implements LovelaceCard {
       padding-top: 0;
     }
     state-history-charts {
-      height: 100%;
       --timeline-top-margin: 16px;
     }
+    .has-height state-history-charts {
+      height: 100%;
+    }
     .has-rows {
       --chart-max-height: 100%;
     }