make footer readable and functional for IE 11 (fix #15536) (#15827)

* make footer readable and functional for IE 11 (fix #15536) * add comment to clarify hard-coded value
mozilla · Jan 9, 2025 · 4be9180 · 4be9180
1 parent 1eb382d
commit 4be9180
Showing 1 changed file with 4 additions and 2 deletions.
diff --git a/media/css/m24/components/footer-refresh.scss b/media/css/m24/components/footer-refresh.scss
@@ -32,7 +32,7 @@ $max-footer-content-width: $content-max;
 
 // primary nav
 .moz24-footer-primary {
-    margin-bottom: $spacer-lg;
+    margin: 32px 0;
 }
 
 .moz24-footer-sections-wrapper {
@@ -76,7 +76,7 @@ $max-footer-content-width: $content-max;
 .moz24-footer-refresh-social-wrapper {
     display: flex;
     align-items: center;
-    margin-bottom: $spacer-lg;
+    margin-bottom: 32px;
 
     @media #{$mq-md} {
         flex-direction: column;
@@ -106,6 +106,7 @@ $max-footer-content-width: $content-max;
 .moz24-footer-links-social {
     margin: 0 0 0 $spacer-lg;
     display: flex;
+    background-color: #161616; // hard-coded value as a fallback for readability on older browsers
 
     @media #{$mq-md} {
         margin: 0;
@@ -173,6 +174,7 @@ $max-footer-content-width: $content-max;
     font-size: $text-body-sm;
     font-family: $primary-font;
     font-weight: 600;
+    @include bidi(((margin-right, 8px, 0), (margin-left, 0, 8px)));
 }
 
 .moz24-footer-primary-list {