Fix #20013, nullify #21112 (#21230)

Add padding to dismiss button for alerts and use position to place it. Removes extra padding on .alert-dismissible's right side, too. We could probably further simplify these things in the future as well.

diff --git a/scss/_alert.scss b/scss/_alert.scss
index 517762eabe3084a72beb1da46fa1fe0b835b3779..d9b4e9b2764828174b288aa04f7a83506b466c47 100644 (file)
--- a/scss/_alert.scss
+++ b/scss/_alert.scss
@@ -26,13 +26,12 @@
 // Expand the right padding and account for the close button's positioning.
 
 .alert-dismissible {
-  padding-right: ($alert-padding-x * 2);
-
   // Adjust close link position
   .close {
     position: relative;
-    top: -.125rem;
+    top: -$alert-padding-y;
     right: -$alert-padding-x;
+    padding: $alert-padding-y $alert-padding-x;
     color: inherit;
   }
 }