diff --git a/CHANGELOG.md b/CHANGELOG.md
index 8d3d153ebf5..8e6928d1831 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -4,6 +4,7 @@ BUG FIXES:
  * api: Added missing devices block to AllocatedTaskResources [[GH-10064](https://github.com/hashicorp/nomad/pull/10064)]
  * cli: Fixed a bug where non-int proxy port would panic CLI [[GH-10072](https://github.com/hashicorp/nomad/issues/10072)]
  * cli: Fixed a bug where `nomad operator debug` incorrectly parsed https Consul API URLs. [[GH-10082](https://github.com/hashicorp/nomad/pull/10082)]
+ * ui: Fixed the rendering of interstitial components shown after processing a dynamic application sizing recommendation. [[GH-10094](https://github.com/hashicorp/nomad/pull/10094)] 
 
 IMPROVEMENTS:
  * consul/connect: Enable setting `local_bind_address` field on connect upstreams [[GH-6248](https://github.com/hashicorp/nomad/issues/6248)]
diff --git a/ui/app/components/das/recommendation-card.hbs b/ui/app/components/das/recommendation-card.hbs
index d1530e6573d..51ecdd46113 100644
--- a/ui/app/components/das/recommendation-card.hbs
+++ b/ui/app/components/das/recommendation-card.hbs
@@ -7,7 +7,7 @@
     ...attributes
     data-test-task-group-recommendations
     class='recommendation-card'
-    {{will-destroy this.recommendationCardDestroying}}
+    {{did-insert this.cardInserted}}
   >
 
     <h2 class="top overview inner-container">Resource Recommendation</h2>
diff --git a/ui/app/components/das/recommendation-card.js b/ui/app/components/das/recommendation-card.js
index 0fdf3f02886..29f203e131f 100644
--- a/ui/app/components/das/recommendation-card.js
+++ b/ui/app/components/das/recommendation-card.js
@@ -15,6 +15,8 @@ export default class DasRecommendationCardComponent extends Component {
 
   @tracked activeTaskToggleRowIndex = 0;
 
+  element = null;
+
   @tracked cardHeight;
   @tracked interstitialComponent;
   @tracked error;
@@ -166,9 +168,13 @@ export default class DasRecommendationCardComponent extends Component {
 
   @action
   accept() {
+    this.storeCardHeight();
     this.args.summary
       .save()
-      .then(() => this.onApplied.perform(), e => this.onError.perform(e))
+      .then(
+        () => this.onApplied.perform(),
+        e => this.onError.perform(e)
+      )
       .catch(e => {
         if (!didCancel(e)) {
           throw e;
@@ -178,10 +184,14 @@ export default class DasRecommendationCardComponent extends Component {
 
   @action
   dismiss() {
+    this.storeCardHeight();
     this.args.summary.excludedRecommendations.pushObjects(this.args.summary.recommendations);
     this.args.summary
       .save()
-      .then(() => this.onDismissed.perform(), e => this.onError.perform(e))
+      .then(
+        () => this.onDismissed.perform(),
+        e => this.onError.perform(e)
+      )
       .catch(e => {
         if (!didCancel(e)) {
           throw e;
@@ -237,8 +247,12 @@ export default class DasRecommendationCardComponent extends Component {
   }
 
   @action
-  recommendationCardDestroying(element) {
-    this.cardHeight = element.clientHeight;
+  cardInserted(element) {
+    this.element = element;
+  }
+
+  storeCardHeight() {
+    this.cardHeight = this.element.clientHeight;
   }
 }