Does anyone know why my background image wont show, did I link in incorrectly
#Background image wont show
neon atlas
honest flame
Try doing /img/Background.jpg with the leading slash so that it looks at the root of your site
Are you seeing the background color at all?
neon atlas
Are you seeing the background color at all?
Yes i am but I dont actually want the bg colour
I was just testing it
Ill try that though
tranquil meteor
The docs say you're supposed to quote it too?```css
background-image: url("../../media/examples/lizard.png");
Yeah, I'm not sure how mandatory that is
neon atlas
Try doing `/img/Background.jpg` with the leading slash so that it looks at the r...
unfortunately this did not work
honest flame
It's hard to tell what the issue is from what you've shared
If you open the dev console do you see any errors loading the image?
neon atlas
If you open the dev console do you see any errors loading the image?
yes i just checked it says failed to load
honest flame
What's the error
neon atlas
What's the error
honest flame
Try putting the image URL in quotes
It's escaping the slash, that's what all that mess is after img
tranquil meteor
If the server is a unix filesystem but the user is accustomed to windows, it's possible they need to be more aware of case sensitivity too?
neon atlas
It's escaping the slash, that's what all that mess is after img
Also tried, still nothing
tranquil meteor
Windows doesn't really allow such shenanigans. 😄
neon atlas
If the server is a unix filesystem but the user is accustomed to windows, it's p...
I typed it out exactly how the file name is though
tranquil meteor
And you can load that image in a browser manually?
neon atlas
Yes, but ive just noticed when i ctrl click on the path it doesnt take me to the img
its like it cant find the path but i swear ive linked it correctly
honest flame
Share the url you're loading and the url it thinks is the image
neon atlas
Share the url you're loading and the url it thinks is the image
Is that not the same url from the original screenshot?
and also it doesnt show anything for the url it thinks it is it just comes up with an error in vscode
honest flame
You mean this screenshot? you can see the URL is mangled to hell
tranquil meteor
Try a known good image URL? https://jsbin.com/leduhonisa/edit?html,css,output
honest flame
Put quotes around the url
neon atlas
Tried again it doesn't seem to work
honest flame
That url is looking in the folder page-framework/css/img which I don't think is correct
Are you doing some kind of build step?
Is the image url prefixed with the /?
neon atlas
It is not no
honest flame
That leading slash tells the browser that the image URL is absolute, if you remove it the URL becomes relative to the current URL
honest flame
You want the slash at the start. It'll tell the browser to look at 127.0.0.1:5500/img and not at 127.0.0.1:5500/page-framework/css/img
So the image is in page-framework/img?
neon atlas
So the image is in `page-framework/img`?
Yes
honest flame
So your CSS should be /page-framework/img/Background.jpg
honest flame
Awesome!