diff --git a/src/components/chart/state-history-chart-line.ts b/src/components/chart/state-history-chart-line.ts
index de7f127ddf..01bd1916b1 100644
--- a/src/components/chart/state-history-chart-line.ts
+++ b/src/components/chart/state-history-chart-line.ts
@@ -267,7 +267,8 @@ export class StateHistoryChartLine extends LitElement {
             margin: 5,
             formatter: (value: number) => {
               const label = formatNumber(value, this.hass.locale);
-              const width = measureTextWidth(label, 12) + 5;
+              // adding 5px extra because preview is not accurate #24027
+              const width = measureTextWidth(label, 12) + 5 + 5;
               if (width > this._yWidth) {
                 this._yWidth = width;
                 fireEvent(this, "y-width-changed", {
diff --git a/src/components/chart/statistics-chart.ts b/src/components/chart/statistics-chart.ts
index f5971528fd..2dd3fd68c5 100644
--- a/src/components/chart/statistics-chart.ts
+++ b/src/components/chart/statistics-chart.ts
@@ -287,7 +287,7 @@ export class StatisticsChart extends LitElement {
       },
       grid: {
         ...(this.hideLegend ? { top: this.unit ? 30 : 5 } : {}), // undefined is the same as 0
-        left: 20,
+        left: 5,
         right: 1,
         bottom: 0,
         containLabel: true,