Bootstrap image via Url

Bootstrap image via Url
0.0 0

#1

Hello,

I need help.

Why cant I see any image on my codepen website ?

.pageOne{
  background:url("https://unsplash.com/collections/1112077/codepen?photo=esCc1qx6TVw");
  background-size:cover;
  height:100%;
}

The syntax is okay in my opinion.


#2

I’ve edited your post for readability. When you enter a code block into the forum, remember to precede it with a line of three backticks and follow it with a line of three backticks to make easier to read. See this post to find the backtick on your keyboard.

Can you post a link to your actual website using this CSS?


#3

#4

Have you tried a different wallpaper?


#5

Yes it appears for a second and then disappears again.
Dont know why


#6

Using one of my wallpapers, works fine :smiley:

I believe your wallpaper was using http not https


#7

The background I see in your Codepen is:

http://bsnscb.com/data/out/139/39251972-office-wallpapers.jpg

and that is different than the one originally posted in your code at the top:

https://unsplash.com/collections/1112077/codepen?photo=esCc1qx6TVw

The reason the one currently in your Codepen will not display is because of the http:// prefix. Codepen uses https:// prefix and most browsers do not allow display of unsecure (http://) content on a page using https.

The second photo is not displaying, is probably because unsplash.com does not allow hot-linking to their images and instead displays nothing or attempts to redirect to another page.


#9

Good catch on the redirect. I didn’t notice it for some reason.