Problem showing my site with safari

Hi guys, I’m new in webflow. I’m working on my portfolio and I find out safari and the google chrome grid system are way different. May I know how to solve the problem?

Here’s my read-only website

https://preview.webflow.com/preview/switchbox-portfolio?utm_medium=preview_link&utm_source=designer&utm_content=switchbox-portfolio&preview=246697ed9144ebdd9c4460fba0c3d11e&workflow=preview

Hi @Jason_Yap,

Welcome to the forum! Would you be able to send through your read-only link again? I’m getting a 404 error when trying to access it.

Thanks!

Hi @mww I have updated the link. Please have a look again, or you can review on bottom.

https://preview.webflow.com/preview/switchbox-portfolio?utm_medium=preview_link&utm_source=designer&utm_content=switchbox-portfolio&preview=246697ed9144ebdd9c4460fba0c3d11e&workflow=preview

Thanks!

Hi @Jason_Yap ,

The site seems to display well on Safari/Chrome for me on desktop and iOS.

Would you be able to send through some screenshots of the discrepancies?

Cheers

Hi @mww sorry I miss out your message,

Here is the screenshot.


I’m not sure why some of the grid is off align.

Thanks!

Hi Jason, welcome to the forum.

When posting asking for help, you’re usually going to find the most success when you make it easy for people to help you — and you can do that by being a soecific as you possibly can on what the issue is. Someone who is totally unfamiliar with your design and what it’s supposed to look like is not going to necessarily know exactly what you mean by “wrong” or “not working” because they don’t have a reference. Which image in which section on which page? At which breakpoint? These are all questions you need to answer so that you’re not giving people more work in order to help you. Screenshots and detailed explanations help a lot, because not everyone is going to take 5-10 minutes out of their day to open up your site in different browsers to check what the issue. We all want to help each other out, but help others help you and the entire ecosystem will be a better place.

Now that I’ve chastized you, though, I would still like to help you.
Safari (and Firefox, too - which you should check) deal with grid items differently. It’s a bit hard to tell what’s going on with your images because of this automatic clycling through different images, which is absolutely a UX and accessibility nightmare that I highy recommend you abandon…

But what may solve your problem is if you set the grid-align and grid-justify to auto instead of stretch.