Images are not downloading in chrome desktop

[grkpranaykumar]

Bug description Images are not downloading after the page loads. If I zoom out size to 90% then they are getting downloaded. On 100% resolution of screen no image is downloaded on the page. This issue is occuring only on my chrome desktop.

I used <LazyLoadImage src={backGroundImageLink} alt=' ' /> for lazy loading the image on the tuples

This is the original webpage on 100% resolution

And this is the screen after I zoom out the screen resolution to 90%

Technical details:

• Package version [e.g. 1.3.2]
• Device [Desktop]
• Operating System [e.g.Linux(Ubuntu)]
• Browser [e.g. Chrome 77.0.3865.90 (Official Build) ]

[gobr]

did you pass width and height attrs to the component?

[jsakas]

Also had this issue. For me it would not load a column in a grid of images. Resizing the window somehow triggered them to load.

Adding width and height attributes fixed it, but would be nice if those were not required.

[matevosyanmko]

Adding a border somehow fixes the issue. for example border: 1px solid transparent

[elamperti]

It also works if you set a min-width and min-height, I guess basically anything that forces the image bounding box to be more than 0x0. It would be very useful if it wasn't needed or if the library could add a CSS rule for it, perhaps.

[MathieuDebit]

I had the same issue with <LazyLoadComponent />. Fixed this way:

const Placeholder = styled.div`
  min-width: 1px;
  min-height: 1px;
`;

<LazyLoadComponent placeholder={<Placeholder />}>
    <Component />
</LazyLoadComponent>

[Aljullu]

Unfortunately, I'm unable to reproduce. Do you happen to know:

• Is this happening in other browsers besides Chrome?
• Is this happening with LazyLoadImage and LazyLoadComponent or only one of them?
• The images which are not loading are the ones above the fold, below the fold or all of them?
• Do you have a repo or a live site where this issue is reproducible?

Thanks in advance!

[jotacodestudio]

@grkpranaykumar, as we didn't hear back from you for a while, we will go ahead and close this issue. Feel free to reopen it if needed.