So, working on the Dasmoto project, everything is going great except the background image. I just can’t seem to make it appear. I have it on my computer and have tried to make a relative path to get there, but it just doesn’t seem to show up. I know many have asked this question before, but reading those threads didn’t seem to get me any closer. I attached the screenshot below so you can see my css code and how the directory is set up (I think!) so that maybe that can help with troubleshooting. Thanks a million in advance!
Hi there!
Have you been able to solve this issue? If not, you need to change the pathing.
./resources/images/pattern.jpeg would work if you were pathing from the index.html file, however, you are currently in the index.css file which is in the CSS directory. You will need to back out of the CSS directory and then move into the images directory.
../ is used to back out of the current working directory. Doing so would move you from the CSS directory into the resources directory, which will allow you to access the images directory with the image.
So, the correct pathing would be:
../images/pattern.jpeg
1 Like
That worked. That makes sense, I now realize I was indeed writing as though I was in the HTML file rather than the CSS file. I will try to remember this for my next project!
I did actually find a way to make the banner appear before this, but I think it was kind of cheating. I used DevTools to discover the URL where the image was on the Codecademy site and then used an absolute path to link to that one instead of the copy on my computer! I think my current solution is more elegant, but at least I got a chance to play with DevTools using my cheating solution.
1 Like