I finished my website but I didn't realize that safari doesn't support the flexbox gap. Is there a way around this without having the mess anything up? This is mostly for my media queries.
<div class="social-media"><a href="https://github.com/"><img class="social-media__icon" src="img/github.png" alt="Github"></a><a href="https://www.linkedin.com/"><img class="social-media__icon" src="img/linkedin.png" alt="LinkedIn"></a></div>
.social-media { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; gap: 8rem; margin-top: 10rem; padding-bottom: 2rem;}.social-media img { width: 90px; height: 90px; }@media only screen and (max-width: 400px) { .social-media { gap: 3rem; margin-top: 5rem; } .social-media img { width: 62px; height: 62px; }}