diff --git a/styles/27-patterns-delete-confirmation.css b/styles/27-patterns-delete-confirmation.css
index 8d0a65f..42e555c 100644
--- a/styles/27-patterns-delete-confirmation.css
+++ b/styles/27-patterns-delete-confirmation.css
@@ -9,6 +9,9 @@
 
 .sg-delete-confirmation-pattern__stage {
   position: relative;
+  display: grid;
+  grid-template-columns: 1fr;
+  align-items: start;
 }
 
 .sg-delete-confirmation-pattern__host {
@@ -21,6 +24,7 @@
 }
 
 .sg-delete-confirmation-pattern__target {
+  grid-area: 1 / 1;
   position: relative;
   overflow: visible;
 }
@@ -40,14 +44,14 @@
 }
 
 .sg-delete-confirmation-pattern__floating-card {
-  position: absolute;
-  top: var(--layout-delete-confirmation-overlay-offset-block-start);
-  bottom: 10px;
-  left: 50%;
-  transform: translateX(-50%);
+  grid-area: 1 / 1;
+  justify-self: center;
+  align-self: start;
+  margin-top: var(--layout-delete-confirmation-overlay-offset-block-start);
   width: calc(100% * var(--layout-delete-confirmation-overlay-width-factor));
   box-sizing: border-box;
   max-width: calc(100% * var(--layout-delete-confirmation-overlay-width-factor));
+  max-height: var(--layout-delete-confirmation-overlay-max-height);
   overflow: auto;
   z-index: var(--layer-delete-confirmation-overlay);
   box-shadow: var(--shadow-overlay);