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 Creating HTML Content Add Image Gallery Content

Posted by Caelan Knowles
Caelan Knowles
1,048 Points

Unable to View pictures, Blue box containing a question mark replaces the picture... Why is that?

I'm way past this lesson, and only out of frustration i disregarded the fact that my pictures won't show up, but now its really bothering me, and i'd like to know how to solve my problem.

2 Answers

Nejc Vukovic
.a{fill-rule:evenodd;}techdegree seal-36
Nejc Vukovic
Full Stack JavaScript Techdegree Graduate 51,574 Points

Well the problem is your folder name is "Img" and you are providing the tags with "img".

Change the folder name to "img" and it should work like clockwork.

You have to be careful: links and folder paths are case sensitive.

Caelan Knowles
Caelan Knowles
1,048 Points

YES! Thanks, it worked like a charm!

Nejc Vukovic
.a{fill-rule:evenodd;}techdegree seal-36
Nejc Vukovic
Full Stack JavaScript Techdegree Graduate 51,574 Points

Glad I could help.

Nejc Vukovic
seal-mask
.a{fill-rule:evenodd;}techdegree seal-36
Nejc Vukovic
Full Stack JavaScript Techdegree Graduate 51,574 Points
Nejc Vukovic
.a{fill-rule:evenodd;}techdegree seal-36
Nejc Vukovic
Full Stack JavaScript Techdegree Graduate 51,574 Points

Hi Caelan,

You get the "? boxes" because your URL's are mistyped or are referring to a file that doesn't exist. Shortly said a typo in your <img src=""> tag. It should be like this: <img src="img/"img-name.png" /> where the "img-name" is the name of your img file and be careful to write the file type correctly -> if you im is .png then use that if .jpg then use that.

Quick tip: the img tags are self-ending -> don't forget the "/" before you close up the tag

Double check where your files are located and make sure you type the path correctly.

If you want the answer to be more specific post your code and your folder structure.

Caelan Knowles
Caelan Knowles
1,048 Points

Heres the folder structure along with my code below... http://imgur.com/rPazja9 Also for some reason my opening tag (<ul>) isn't appearing when i try to post it here, but it is there in my workspace...

<ul id="gallery"> <li> <a href="img/Example_image.jpg"> <img src="img/Example_image.jpg" alt=""> <p>Expirementation with RELATIVITY.</p> </a> </li> <li> <a href="img/numbers-02.jpg"> <img src="img/numbers-02.jpg" alt=""> <p>Playing with blending modes in Photoshop.</p> </a> </li> <li> <a href="img/numbers-06.jpg"> <img src="img/numbers-06.jpg" alt=""> <p>Trying to create an 80s style of glows.</p> </a>
</li> <li> <a href="img/numbers-09.jpg"> <img src="img/numbers-09.jpg" alt=""> <p>Photoshop styled brushes.</p> </a>
</li> <li> <a href="img/numbers-12.jpg"> <img src="img/numbers-12.jpg" alt=""> <p>Creating lines using repition.</p> </a>
</li>
</ul>