diff --git a/src/components/chart/state-history-chart-line.ts b/src/components/chart/state-history-chart-line.ts
index 8dc0afae98..0d58719a2b 100644
--- a/src/components/chart/state-history-chart-line.ts
+++ b/src/components/chart/state-history-chart-line.ts
@@ -305,8 +305,10 @@ export class StateHistoryChartLine extends LitElement {
         visualMap: this._visualMap,
         tooltip: {
           trigger: "axis",
+          renderMode: "html",
           position: "bottom",
           align: "center",
+          confine: true,
           formatter: this._renderTooltip,
         },
       };
diff --git a/src/components/chart/state-history-chart-timeline.ts b/src/components/chart/state-history-chart-timeline.ts
index e14042409f..f65734d2d1 100644
--- a/src/components/chart/state-history-chart-timeline.ts
+++ b/src/components/chart/state-history-chart-timeline.ts
@@ -255,8 +255,10 @@ export class StateHistoryChartTimeline extends LitElement {
         right: rtl ? labelWidth : 1,
       },
       tooltip: {
+        renderMode: "html",
         position: "bottom",
         align: "center",
+        confine: true,
         formatter: this._renderTooltip,
       },
     };
diff --git a/src/components/chart/statistics-chart.ts b/src/components/chart/statistics-chart.ts
index 55a299c787..73d8c14767 100644
--- a/src/components/chart/statistics-chart.ts
+++ b/src/components/chart/statistics-chart.ts
@@ -335,8 +335,10 @@ export class StatisticsChart extends LitElement {
       },
       tooltip: {
         trigger: "axis",
+        renderMode: "html",
         position: "bottom",
         align: "center",
+        confine: true,
         formatter: this._renderTooltip,
       },
     };