diff --git a/src/panels/calendar/ha-full-calendar.ts b/src/panels/calendar/ha-full-calendar.ts
index 14645c5486..51ebdffb32 100644
--- a/src/panels/calendar/ha-full-calendar.ts
+++ b/src/panels/calendar/ha-full-calendar.ts
@@ -259,6 +259,7 @@ export class HAFullCalendar extends LitElement {
 
   protected firstUpdated(): void {
     this._loadCalendar(this.initialView);
+    this._activeView = this.initialView;
   }
 
   private async _loadCalendar(initialView: FullCalendarView) {
@@ -512,7 +513,7 @@ export class HAFullCalendar extends LitElement {
             --ha-card-background,
             var(--card-background-color, white)
           );
-          min-height: 400px;
+          height: var(--calendar-height);
           --fc-neutral-bg-color: var(
             --ha-card-background,
             var(--card-background-color, white)
diff --git a/src/panels/calendar/ha-panel-calendar.ts b/src/panels/calendar/ha-panel-calendar.ts
index c182d3484c..040576c3e9 100644
--- a/src/panels/calendar/ha-panel-calendar.ts
+++ b/src/panels/calendar/ha-panel-calendar.ts
@@ -178,6 +178,7 @@ class PanelCalendar extends LitElement {
           .events=${this._events}
           .calendars=${this._calendars}
           .narrow=${this.narrow}
+          .initialView=${this.narrow ? "listWeek" : "dayGridMonth"}
           .hass=${this.hass}
           .error=${this._error}
           @view-changed=${this._handleViewChanged}
diff --git a/src/panels/lovelace/cards/hui-calendar-card.ts b/src/panels/lovelace/cards/hui-calendar-card.ts
index 0dce19da97..3633244705 100644
--- a/src/panels/lovelace/cards/hui-calendar-card.ts
+++ b/src/panels/lovelace/cards/hui-calendar-card.ts
@@ -242,6 +242,10 @@ export class HuiCalendarCard extends LitElement implements LovelaceCard {
         padding-inline-start: 8px;
         direction: var(--direction);
       }
+
+      ha-full-calendar {
+        --calendar-height: 400px;
+      }
     `;
   }
 }