مشکل در Responsive کردن با مدیا کوئری

سلام وقت بخیر

بنده یه پروژه ای دارم استارت میزنم که یه مشکلی من تو بحث ریسپانسیو دارم که اکی نمیشه من در قسمت فوتر سایتم یه بخشی گذاشتم برای راه های ارتباطی بعد من آیکن هاشو با pseudo-class سی اس اس نوشتم همون before , after بعد من تو اندازه های مختلف چک میکنم اون آیکن ها جاهاشون بهم میخوره چیکارش کنم که اکی بشه؟؟

و اینکه نظرتون هم در رابطه با سایتی که طراحی کردم بدید هم ممنون میشم :innocent: :pray:

https://codepen.io/Mohammad-Amin-Naghian-the-solid/pen/LYXmqOB

سلام

دلیلش اینه که مارجین راست رو به درصد دادین که باعث میشه با تغییر اندازه جاش عوش بشه … بهتر که المان مادر flex باشه و با flex هندل کنید که عوض نشه جاش