Streaming live at 10am (PST)

Dynamic Items Don't Scale Properly in Safari Browser

#1

I just noticed my site doing this, unsure if I did something wrong.

If you scale your browser on Safari to say ‘horizontal mobile’ size, then hit refresh and then scale up. The ‘slider’ will not scale with the rest of the site.

And the opposite will happen, if you load in larger and scale down, there is a section where the ‘posters’ I have under ‘Latest Releases’ will have a huge gap…

Here’s the active site: https://webber-studios.webflow.io

Any help would be great! Unsure what I have setup wrong… or if this is just something with Safari and Webflow?

Pasted images are of when you refresh at ‘mobile’ size and scale up to normal. The larger slide is what the ‘slider’ should look like at normal size.

Here is my site Read-Only: https://preview.webflow.com/preview/webber-studios?utm_source=webber-studios&preview=8ee56770852affcee26b22e7c15485ca

#2

Hi @c062785,

Thanks for contacting us about your slider not being responsive, as this definitely sounds like odd behavior if your design settings are correct

I tried reproducing this behavior on my end, but was unable to as you may note in the following short screencapture: https://cl.ly/e68e906a7530

Can you please try the following:

(1) Try to reproduce the error while using Incognito mode with browser extensions turned off: https://support.google.com/chrome/answer/95464?hl=en

(2) If the problem persists, please take a screenshot of your Console and send it to me: https://cl.ly/2Q2l1g0B3v0s

Thanks in advance :bowing_man:

#3

Mistercreate,

Thank you for digging into this, this seems to only be a ‘Safari’ browser issue.

On chrome it looks like it’s ok…

That’s why it’s kind of mind boggling. If you have Safari or access to a mac, you can see how it breaks there.

And again, it’s fixed when you refresh the page at that size, it just happens if you load the page at a smaller size and scale up.

Thank you for taking the time to dig into this!

#4

Thanks for catching that. Yes, we were able to complete a test within Safari as well.

Though, we were unable to reproduce the issue as you may note in the following short screencapture: https://cl.ly/da8c6ffa4495

This does sound like odd behavior.

Would you be able to attempt within Private Browsing (https://support.apple.com/guide/safari/browse-in-private-ibrw1069/mac) with browser extensions disabled (https://support.apple.com/en-us/HT203051)?

Also, could you please let me know what browser version you’re using by sending me your information from this page? https://www.whatismybrowser.com/

There should be a small share link when you visit the page which you can send to me.

Thanks in advance :bowing_man:

#5

Mister,

Thanks again for the help. I basically re-built the slider from the beginning and figured it out!

You have to have your image inside of a div in order to style things properly.

That’s inside of the slider element itself, there must be a div.

I’ve pasted a screen shot for anyone who might want to do what I did and are facing issues!

Thanks again!

closed #6

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