Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

CSS

Jumah Hamilton
Jumah Hamilton
8,648 Points
Posted by Jumah Hamilton
Jumah Hamilton
8,648 Points

Coding website in Sublime text 3. Try to view progress w FF/Chrome/Safari get error: Not allowed to load local resource?

Images will not load from img/photo.jpg only from root folder. Not sure why it will not works.

Ameer baddar
Ameer baddar
Courses Plus Student 582 Points

Hey there, do You still have the issue ? if yes, can you put your project tree in here so that I can be more useful to you ! friendly

Jumah Hamilton
Jumah Hamilton
8,648 Points
Jumah Hamilton
Jumah Hamilton
8,648 Points

Here is my CSS, I still have the issue. The photo will not load from the img folder, only root.

Body {

background-image: url('img/logo.jpg');
background-repeat: no-repeat;
background-position: center;
background-attachment: fixed;
background-size: cover;
background-color: : #ffffff;
height: 100%;

}

2 Answers

Sergey Podgornyy
Sergey Podgornyy
20,660 Points
Sergey Podgornyy
Sergey Podgornyy
20,660 Points

@jumahhamilton Can you describe also your directory structure? Probably your img folder just not is subfolder of directory, where your CSS-file placed.

So you could either try to refer img folder from root folder

background-image: url('/img/logo.jpg');

Or if your img folder is one level above, then refer it like:

background-image: url('../img/logo.jpg');
Jumah Hamilton
Jumah Hamilton
8,648 Points
Jumah Hamilton
Jumah Hamilton
8,648 Points

Thanks for your assistance. What I ended up dong is moving the mystyles.css file to the root directory. It seemed to work. Will that present a problem in the future?

Sergey Podgornyy
Sergey Podgornyy
20,660 Points
Sergey Podgornyy
Sergey Podgornyy
20,660 Points

If your images will be in img folder, that in root, than yes, your code

background-image: url('img/logo.jpg');

will work fine, because it the same as:

background-image: url('./img/logo.jpg');

what means go to img folder, which is in the current directory. If you need go one folder up, use two dotes .. in your path. For example, you have in your root - 2 folders: css and img. If you place you style file in css folder, you need to use this line:

background-image: url('../img/logo.jpg');

what actually means -> Ok, current file is in css folder and to access image folder I need go one level up on directories tree (using ..), then I need to open img folder, where chosen image placed.

Hope this would be helpful for you