Body tag's Background-image not appearing on mobile!

Background-image is not appearing on mobile, but works fine on desktop.I’ve been researching this for hours and cannot for the life of me figure it out! Can anyone please help?

Codepen: https://codepen.io/matthewtmeloney/pen/gzdjXy

This may actually have something to do with hosting the image in Dropbox. I’m just saying that because I experienced some issues using Dropbox myself a while back.

Perhaps test that theory by finding some random image online and see if that works.

403 error is showing not a logged in user.

I would suggest signing up for Cloudinary (free), uploading your images there, and using their HTTPS link to images to avoid issues with CORS.

1 Like

hey! thanks for the response. How is that working?

It is because he is in Japan. J/K. I will let him explain…

2 Likes

I checked out Cloudinary and researched CORS (wasn’t familiar with it). Looks like it fixed it.

Thanks!

Dcook is completely ‘right’ here-- I think you may have just not provided the right ‘reference’ to ‘DropBox’ but CodePen, somewhat, rightly so, is very picky about where you pull resources from out of external sites.

For this context lets just say Cloudinary in this way ‘works’ without going into server side configuration.

1 Like

There are different ways that dropbox can serve files as links. But, I’ve seen rumblings about, for example, imgur blocking codepen requests and I wouldn’t be surprised if dropbox blocked them unless you are signed in. You used to be able to “host” a static page in dropbox and they’ve shut that down. I suspect that dropbox doesn’t want people to use it as a “hosting” service-> it’s a storage service.

Anyway as @abalducci has said use cloudinary. I use that and it’s working good.

An alternative:
If you use github you can upload an image there and use the raw link.

btw your quote generator looks awesome. Love the Asiago! lol :wink:

1 Like