diff --git a/src/panels/history/ha-panel-history.ts b/src/panels/history/ha-panel-history.ts
index b5f1c2bc13..6bb2e9ce11 100644
--- a/src/panels/history/ha-panel-history.ts
+++ b/src/panels/history/ha-panel-history.ts
@@ -515,22 +515,11 @@ class HaPanelHistory extends SubscribeMixin(LitElement) {
       css`
         .content {
           padding: 0 16px 16px;
+          padding-bottom: max(env(safe-area-inset-bottom), 16px);
         }
 
         state-history-charts {
-          height: calc(100vh - 136px);
-        }
-
-        :host([narrow]) state-history-charts {
-          height: calc(100vh - 198px);
-        }
-
-        .progress-wrapper {
-          height: calc(100vh - 136px);
-        }
-
-        :host([narrow]) .progress-wrapper {
-          height: calc(100vh - 198px);
+          overflow-x: hidden;
         }
 
         :host([virtualize]) {
@@ -539,6 +528,10 @@ class HaPanelHistory extends SubscribeMixin(LitElement) {
 
         .progress-wrapper {
           position: relative;
+          display: flex;
+          align-items: center;
+          flex-direction: column;
+          padding: 16px;
         }
 
         .filters {
@@ -566,13 +559,6 @@ class HaPanelHistory extends SubscribeMixin(LitElement) {
           }
         }
 
-        ha-circular-progress {
-          position: absolute;
-          left: 50%;
-          top: 50%;
-          transform: translate(-50%, -50%);
-        }
-
         .start-search {
           padding-top: 16px;
           text-align: center;