From 4be91804696ab5a9c633530096987c9855ecb35a Mon Sep 17 00:00:00 2001
From: Jingwen Zhu <42974891+wen-2018@users.noreply.github.com>
Date: Thu, 9 Jan 2025 09:43:09 -0400
Subject: [PATCH] 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
---
 media/css/m24/components/footer-refresh.scss | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/media/css/m24/components/footer-refresh.scss b/media/css/m24/components/footer-refresh.scss
index 352603da331..852d1355d02 100644
--- 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 {