diff --git a/app/assets/javascripts/work_items/components/design_management/design_item.vue b/app/assets/javascripts/work_items/components/design_management/design_item.vue
index 2a2db7a877d566e076c8126c6a0bfafe020e75d9..3eeefa4f38a8d4075f89445c628f486259f207ef 100644
--- a/app/assets/javascripts/work_items/components/design_management/design_item.vue
+++ b/app/assets/javascripts/work_items/components/design_management/design_item.vue
@@ -168,7 +168,7 @@ export default {
         </span>
       </div>
       <gl-intersection-observer
-        class="gl-grow"
+        class="gl-flex gl-grow gl-justify-center"
         data-testid="design-image"
         :data-qa-filename="filename"
         @appear="onAppear"
diff --git a/spec/frontend/work_items/components/design_management/__snapshots__/design_item_spec.js.snap b/spec/frontend/work_items/components/design_management/__snapshots__/design_item_spec.js.snap
index a6a0205017aa5a1a2b2b535cbf2ca135e8001a50..5f320bd8edab2a1ea1771b3c8c552e3c900e00d0 100644
--- a/spec/frontend/work_items/components/design_management/__snapshots__/design_item_spec.js.snap
+++ b/spec/frontend/work_items/components/design_management/__snapshots__/design_item_spec.js.snap
@@ -16,7 +16,7 @@ exports[`Design item component with notes renders item with multiple comments 1`
     class="card-body gl-flex gl-items-center gl-justify-center gl-overflow-hidden gl-p-0 gl-relative gl-rounded-t-base"
   >
     <gl-intersection-observer-stub
-      class="gl-grow"
+      class="gl-flex gl-grow gl-justify-center"
       data-qa-filename="test"
       data-testid="design-image"
     >
@@ -81,7 +81,7 @@ exports[`Design item component with notes renders item with single comment 1`] =
     class="card-body gl-flex gl-items-center gl-justify-center gl-overflow-hidden gl-p-0 gl-relative gl-rounded-t-base"
   >
     <gl-intersection-observer-stub
-      class="gl-grow"
+      class="gl-flex gl-grow gl-justify-center"
       data-qa-filename="test"
       data-testid="design-image"
     >