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

HTML How to Make a Website CSS: Cascading Style Sheets Center the Wrapper

Hope Gobron
Hope Gobron
3,395 Points

When I click "Preview Workspace" I am unable to see the photos I added, only icons saying they're there.

When I click "preview workspace" my browser is only showing the icons which say there is a photo file there, but not the full photos themselves.

1 Answer

Matthew Lang
Matthew Lang
13,483 Points

Please show us the code that introduces the images, e.g

<img src='file path'>

or

background-image: url('file-path');

Most likely you have the file path incorrect. This is a common issue, and I used to run into it myself a few times.

  1. Firstly, make sure your image is indeed in the correct folder.
  2. Take note of the files format, since this must be included when specifying it. e.g 'coffee.jpg' must include the '.jpg' in your code, it cannot be left as just 'coffee'.
  3. Triple check the file directory of your image, and ensure you have located it correctly in your code.

Another thing to remember is that if you are inside a CSS file, which is inside a folder in which your image doesn't reside in, you must use** '../' **before your file path to back out of the folder and back into your main one. For example,

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

Check here for more information if my explanation wasn't clear enough about backing out of files.

Hope I helped :)