Overflow problems with Safari browser

Ask the community
1

Hi,

I’m experiencing some problems with the overflow function (or is it something else?) when visiting my website in the Safari browser.

I’ve created a Editor X site at www.jesperhellzen.com where I want the images to simply slide over the text at the top when scrolling. It works perfect in Chrome but when it comes to Safari it simply doesn’t work and the images gets underneath the text instead.

Does anyone know what the problem might be or have recommendations on alternative solutions?

Thanks in advance,

Greetings from Sweden

1636×2029 607 KB

2

Hi Jesper, this might be a Safari quirk, I’ve seen a few more. I think this one can be resolved by structuring your site in a different way. Rather than a separate header/section for the background words (Open for business etc.), put them in the same section as the other elements (the photos). Then set the background elements to sticky. Put them in the top of the section, but arrange them to be in the back.

3

Thank you for your help! I’ll try it directly. As you can see in the attached image, all the images are built in seperate sections. Would you recommend to build them in another way?

https://static.wixstatic.com/media/a27d24_969d4d17c3f34994a2efb489da66e9ae~mv2.png(image larger than 4 MB)

4

Hi Jesper, I didn’t realize you built it that way! If you want to go ahead and try the new method, I recommend duplicating your site first so you save what you have now. (in the ‘my site’ screen).

Then use one section and create a grid within it. Add a row in the grid for each image. Position each image through setting the grid position (in properties) and stretch each image within the grid position.

5

I tried to rebuild the website but the problem seems to remain. What do you think - is it all coming down to a Wix VS Safari issue or something I’ve done wrong? :slight_smile:

3256×1636 396 KB

6

Can you share your rebuilt site, Jesper?

7

I found it now. No idea why it doesn’t work. Pls try this quick example I made, where it does seem to work: https://verbaldancing.editorx.io/mysite-13

8

Thanks verbaldancing, I really appreciate all the time and effort you put into this case. Your website works perfectly on desktop when opening the website. However on iPhone or when resizing the browser the overflow seems to disappear and the logo gets on top…