Yesterday I was making an HTML element and this problem hit me up.
The Background-image of the DIV is not showing, and I was curious, the link worked fine.

Here is my code

```html
<div id="floating-image-<?php echo $id; ?>" class="fl-<?php echo $id; ?>" style="
    background-image: url(https://images.pexels.com/photos/290470/pexels-photo-290470.jpeg?h=350&auto=compress&cs=tinysrgb);
    margin-top: 20px;
   height: 200px;
    width: 200px;
    background-position: center center;
   background-repeat: no-repeat;
   transform: translateY(0px);
    background-size: contain;
   position: relative;
    margin-right: auto;
   margin-left: auto;
    max-width: 80%;
    display:block;
    "></div>
```

**EDIT**
ok, I edited the dynamic codes and replaced them with some static output.
Sorry for misleading
**Another EDIT**
I changed the image and now I am using a smaller image, but still it doesn't show up
['https://Stackoverflow.com/questions/42317542', 'https://Stackoverflow.com', 'https://Stackoverflow.com/users/-1/']
I have checked, background image is properly working. Your image size is very big, approx 7 MB. Reduce it upto 300KB, too big to show.
Issue is in the image,
You have used very high quality image.
if you use a low quality image than you have currently used,
it will work fine.