最近我又开始学习网页设计，为我们正在组织的免费节日创建了一个网站。现在我对 CSS Grid 感到非常失望，一切似乎都在进行中，直到有人告诉我该网站在 Safari 中看起来很愚蠢..
网格系统的下部显示为它应该是......在移动设备上。但是标题下方的赞助商徽标似乎是一个垂直列表。
现在我可以用 float 以不同的方式修复这些徽标，对于下部我不知道如何使它看起来相同，但我宁愿只是为 Safari 找到一个解决方法。
我希望它与网格模板列有关，尝试了一些东西（从 auto 更改为 fr 并添加 align/justify-self），但我自己似乎无法弄清楚。这里有人能帮我吗？
HTML：
<div class="sponsors">
<div class="sponsorlogo">
<a href="https://www.recupel.be/nl/" target="_blank"><img src="img/Logo_Recupel.png" alt="Logo Recupel" /></a>
</div>
<div class="sponsorlogo">
<a href="https://www.brugge.be/" target="_blank"><img src="img/Logo_StadBrugge.png" alt="Logo Stad Brugge" /></a>
</div>
<div class="sponsorlogo">
<a href="https://www.transform3.be/" target="_blank"><img src="img/Logo_transform3.png" alt="Logo transform3" /></a>
</div>
<div class="sponsorlogo">
<img src="img/Logo_ecoFoundation.png" alt="Logo eco Foundation" />
</div>
<div class="sponsorlogo">
<a href="https://www.aandeplas.be/" target="_blank"><img src="img/Logo_AandePlas.png" alt="Logo Domein Aan de Plas" /></a>
</div>
<div class="sponsorlogo">
<a href="https://www.legendstours.be/" target="_blank"><img src="img/Logo_LegendsFreeWalkingTours.png" …