▼
Streaming live at 10am (PST)

Safari rendering things differenly

#1

I'm having some issues with some elements in my website are showing up for only Safari (both Desktop and mobile). Text in my blog seems to randomly double up on top of each other, and divs seems to arrange themselves in different orders, ignore sizing rules and take on the wrong backgrounds. I've attached examples of what it currently looks like, and what it's meant to look like.

IMG_8419.PNG360x640 131 KB
image1.PNG750x1334 236 KB
image2.PNG360x640 118 KB

https://preview.webflow.com/preview/tribeca-financial?preview=a3492617512ed85dc710851e1132d244

Here's what they SHOULD look like

Screen Shot 2016-09-16 at 11.24.04 AM.png359x870 200 KB
Screen Shot 2016-09-16 at 11.24.29 AM.png371x849 153 KB
Screen Shot 2016-09-16 at 11.23.48 AM.png1180x871 605 KB

Here is my public share link: https://preview.webflow.com/preview/tribeca-financial?preview=a3492617512ed85dc710851e1132d244

#2

Hi,

I'm experiencing almost the same issues with my site.

It looks perfect on the Pc with Chrome Browser at any size and on my Android Nexus6p but trouble on iPhone and Sms Galaxy.

On this site, I'm using the "flex" component which seems that struggling on responsive to completely different sizes.

Please see attached screenshots from iPhone 6S, Sams Galaxy 7S and Nexus 6P

iPhone

bs_realios_Mobile_iPhone 6S-9.0.jpg623x1107 81.2 KB

Galaxy

bs_realdroid_Mobile_Samsung Galaxy S7-6.0-1440x2560.jpg623x1107 102 KB

Nexus 6P - perfect

Nexus 6P.png397x719 165 KB

.

#3

Same here.
Lots of issues with Safari (I have a small white space at the bottom of my site on Safari, but looks fine on every other browsers, seems to be an issue with the VH unit)

closed #4

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