Question posted in 
Please forgive me if my jargon is a bit strange, as I am still a beginner with this stuff…
I am trying to open an image using CSS with a relative path. When I use the relative path to the image I want with "background-image: url()" the only way I can display the image is if the image is in the same folder as the main CSS file ("index.css"). If I move the image ANYWHERE else I cannot display the image.
EXAMPLE #1:
css(folder) -> index.css(main file), image.jpeg(image i want)
In the example above I can write "background-image: url(image.jpeg)" and the image will appear.
EXAMPLE #2:
HOWEVER, let’s say I create another folder called "image_folder" inside the css folder that will hold the image:
css(folder) -> index.css(main file), image_folder(image folder that holds the image.jpeg)
In this example I write "background-image: url(image_folderimage.jpeg)" and the image doesn’t appear.
Why does the image only appear if I have the image in the same folder as "index.css"? I can’t seem to put the image anywhere else and have it appear.
Thanks
PICTURES:
2
Answers
This is your code, you have made a small mistake using backward slash
, your code should look like this:use a single dot to locate its parent folder and navigate the image you want to display like I have shown. And use vs-code editor if you are not using vs-code, its a good software to write code and beginner friendly.
I see the problem u have, make sure to define height and width when using background CSS property, or you can’t see the image