Slider breaks on safari, but not chrome

Here is my project,

In chrome the slider looks like:

in safari the slider looks like:

In the editor it looks like:

I cannot figure out how to solve it because it doesn’t look off in the editor. Also, when I resize the safari page, or hit the back button then forward button, it then looks like it’s supposed to.


Here is my site Read-Only: LINK
([how to share your site Read-Only link][2])

[2]: Share a read-only link | Webflow University

1 Like

https://preview.webflow.com/preview/mahns-groovy-project-c704ca0c628074d592?utm_medium=preview_link&utm_source=designer&utm_content=mahns-groovy-project-c704ca0c628074d592&preview=235e6f4050136959d087fbb8706d79cb&pageId=6189c95debe42e18b865638f&workflow=preview

hi @Donji I have been now looking into your issue and searching on internet but nothing there that will solve issue when you add more that one slide. When I was messing around with slider I have found that this issue only happened when slider is placed in CSS Grid. It narrowed down where issue can be and finally I have found that CSS Grid space where slider is placed have to have min/max set up. So it is stable now in Safari, Firefox, Chrome and Brave.

It may be WF issue

Here is image what to set

Read-Only & LIVE just in case.

Hope that helps solve your request.

1 Like

thank you so much! I’ll try this out!

that worked, thank you stan, you are the best!

1 Like

This topic was automatically closed 24 hours after the last reply. New replies are no longer allowed.