Why is my background not showing?

Question

So I'm learning CSS at the moment but for some reason, if I try to make the background it doesn't show up.
Could you guys help me out?
(The /CSS/index.css is the right path on my local drive)

Also, tips would be nice!

https://code.sololearn.com/WvD7tREP1wz3

Answer 1

https://code.sololearn.com/WmzIRrY17Jp4/?ref=app

Yukari I think you want this type 😊😊😊

Answer 2

Yukari Image is public but not secure URL. You need image which has https.

Answer 3

When I used Dropbox it's working because the link has https. But when you will put that image link then it will not load.

Try to change background URL with this and check again.

http://tatsuki.bplaced.net/images/BgMain.jpg

https://code.sololearn.com/WNhVSjFzk6x8/?ref=app

Answer 4

AJ || AY || AC || ANANT but i think she need a proper background which shown full in these information .

Answer 5

Aaron Eberhardt So there maybe the reason background color black and orange. And also height is too much.

Answer 6

I don't know what you were trying to achieve but the background looks fine for me. Yet I found these lines that are useless:
html {
background-color: black;
}
The background of the html will be hidden underneath the background of the body element. Also you usually don't apply CSS to the html tag.
And some tips:
1. Use consistent code styling. Like always 2 spaces for indentation etc.
2. Use the dev tools of your browser (preferably Firefox developer edition) to debug you CSS :)

Answer 7

AJ || AY || AC || ANANT but the image does load perfectly.
There's no need to use Dropbox anyway. There are better solutions :)

Answer 8

@AJ I don't know what you mean? The link is correct and loads the image. The picture is public and no need for dropbox.

Answer 9

I have noticed that Sololearn takes secure URL.

Answer 10

Yukari you don't need https to use local files. Some browsers don't open local resources by default to improve security. Yet you can enable it with just a small config change (at least in Firefox). Usually your browser shows some error in the console that explains why an image couldn't be loaded.

Answer 11

Abhay pratap Singh She needs background image

Answer 12

Because your image is not loading from that link so you can use Dropbox. Go there and upload your photo. Get link from there and put here.

Check this code. I have used.

https://code.sololearn.com/W0MuBAoV7L41/?ref=app

Answer 13

@Aaron Eberhardt, I took out the HTML tag. And do you mean by applying the CSS to the HTML by the <link>?
Normally I do format so it looks better.

What I'm trying to achieve is that the background fits into certain parts of the text. Like an image behind the text with my profile picture. If you scroll, the background will change at some point. I want to put this website online someday thats why I typed what I put into Visual Studio Code.

Do you know what I mean? Anyways thanks for helping!

Answer 14

The fun fact is one sololearn it works but not if I use my editor locally with the image locally linked for offline use

Answer 15

But still. If I do ../images/BgMain.jpg it's still a white background. And if I use the link version just like on sololearn it doesn't show up when I open it in the browser

Answer 16

OK that explains some stuff. But that it didn't work with linking just so with images folder that's confusing

Answer 17

Yeah I wasn't that far yet. But thank you for the code ^^

Answer 18

If you remove the "100% 100%" and move the semicolon next to the closing parentheses it will load. If you are trying to change the width and height, start a new line.