diff --git a/app/assets/stylesheets/framework/modal.scss b/app/assets/stylesheets/framework/modal.scss
index 7d53a631cdf..f10eaedcc04 100644
--- a/app/assets/stylesheets/framework/modal.scss
+++ b/app/assets/stylesheets/framework/modal.scss
@@ -59,7 +59,7 @@
   }
 
   @include media-breakpoint-up(sm) {
-    .btn:first-of-type {
+    .btn:nth-child(1) {
       margin-left: auto;
     }
   }
diff --git a/changelogs/unreleased/45453-fix-delete-protected-branch-btn.yml b/changelogs/unreleased/45453-fix-delete-protected-branch-btn.yml
new file mode 100644
index 00000000000..64776abdc07
--- /dev/null
+++ b/changelogs/unreleased/45453-fix-delete-protected-branch-btn.yml
@@ -0,0 +1,5 @@
+---
+title: Fixes modal button alignment
+merge_request: 22024
+author: Jacopo Beschi @jacopo-beschi
+type: fixed