Some images not loading on Safari

Design help General
1

My site displays CMS images inside link blocks in a responsive grid. Though the images display correctly on desktop and mobile using chrome, firefox, and most tests on safari, my client reports that, when viewing on safari, some images on page 2 of results don’t load on safari. This continues on page 3, with most images not loading at all by page 4.

I’ve read related forum posts like this and tried a few things already, including:

  • Adjusting the dimensions settings of the images
  • Making the images fixed sizes
  • Ensuring image loading is set to eager
  • Setting background images for image’s parent element and/or for the image itself

None of these have fixed the issue. I appreciate any insight anyone can share! Thanks!

Correctly displaying page 2 and 3:

Page 2 results (correct).PNG
Page 2 results (correct).PNG1916×934 222 KB

Page 3 results (correct).PNG
Page 3 results (correct).PNG1920×935 215 KB

Incorrectly displaying page 2 and 3 on safari:

Page 2 results (incorrect).PNG
Page 2 results (incorrect).PNG1920×1029 221 KB

Page 3 results (incorrect).PNG
Page 3 results (incorrect).PNG1920×1059 101 KB

Here is my site Read-Only: Webflow - DOOMLINGS Compendium

1 Like
2

When I inspected in safari, I found out that the images were taking 0x0 space, so
I fixed this by assigning each image an ID, and then giving these ID width and height.

3

I have the same problem. I have some images that load on Safari, but not Chrome. I don’t know what to do.

4

@Ben_B -If you want help you need to follow the posting guidelines so we have something to work from. You really should create your own post for this since your situation is most likely unique to your implementation.

1 Like
5

Thanks, Webev for reminding me of the guideline. I fixed the problem. :heart:

6

Please how did you fix the problem? I’m having the same issue now

1 Like