[sturner]

Hello! We are having an issue with the site displaying differently on the Safari mobile browser than on Chrome, Edge, or Firefox. Everything is responsive on those browsers, but when it is viewed on an iPhone with Safari, there are several overlapping issues. Rows will be on top of each other instead of moving down below other rows. We have looked through the code and can’t find any issues regarding responsive properties. Clearly, it all shifts correctly with some browsers, and the issue is only with the specific browser. I did try implementing the code from this thread with no luck: https://nicethemes.com/forums/topic/differences-between-chrome-and-safari-and-some-bugs/. Is there a bug or some code discrepancy that is happening? Thank you!

[Juanfra Aldasoro]

Hi,

Thank you for reaching out to us and sorry for the delayed response. I hope you’re doing well.

Are you using the latest version of the theme? Would you please try adding the following CSS:

@media all and (max-width: 767px) {
    .nice_row-inner, .vc_inner, .row-inner {
        display: block;
    }
    .background-inner:empty {
        display: initial !important;
    }
}

Best,
Juan.

[sturner]

Hi Juanfra!

Yes, our theme is updated and our plugins are all current.

I have added the code to the “custom code & scripts” area with no change. Is there a specific page in Editor that I am supposed to add it to instead? Please feel free to take a look at the site on Safari with any mobile device. You can see that the team photos still overlap the “Leadership Team” section. Any other ideas? Could there be an issue with Safari? I’ve tried clearing cache and browsing history within Safari. It is happening with multiple of our iOS devices here.

[sturner]

Home

[sturner]

thank you this issue is resolved

[Juanfra Aldasoro]

Thanks for the follow-up. 🙂

Have a nice day,
Juan.