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 Include External CSS

Photos showing up as question mark icons in "preview" mode

Hey all, This is probably something silly (I'm relatively tech savvy but anyway...) when I run my preview of Nick Pettit's portfolio page, the images are showing up as question mark icons. All my quizzes have been successful thus far, and it seems like the coding is right. What should I try to fix this in the preview feature?

8 Answers

Tommy Gebru
Tommy Gebru
30,164 Points

A great way to provide code on the forum is using this neat trick

<!DOCTYPE html> No Regrets Family footer { color: green; } Family Adventure Traveling the World Together Portfolio Contact Experimentation with Color and Texture. playing with blending modes with photoshop. trying to create an 80s style. drips created using photoshop brushes. creating shapes using repetition. Ā© 2014 Family.

Although this does '''''' seem similar to this```````````

Tommy Gebru
Tommy Gebru
30,164 Points

A problem stated correctly is already half solved. Please help me understand your question as well as what your code below is supposed to accomplish.

<!DOCTYPE html> 
No Regrets Family 
footer { color: green; } 
Family Adventure Traveling the World Together Portfolio Contact Experimentation with Color and Texture. playing with blending modes with photoshop. 
trying to create an 80s style. 
drips created using photoshop brushes. 
creating shapes using repetition. 
Ā© 2014 Family.
Tommy Gebru
Tommy Gebru
30,164 Points

Could you provide your code?

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>No Regrets Family </title> <link rel="stylesheet" href="css/normalize.css"> <style> footer { color: green; } </style> </head> <body> <header> <a href="index.html"> <h1>Family Adventure</h1> <h2>Traveling the World Together</h2> </a> <nav> <ul> <li><a href="index.html">Portfolio</a></li> <li><a href="about"</li></a></li> <li><a href="contact.html">Contact</a></li> </ul> </nav> </header> <section> <ul> <li> <a href="img/numbers-01.jpg"> <img src="img/numbers-01.jpg" alt=""> <p>Experimentation with Color and Texture.</p> </a> </li> <li> <a href="img/numbers-02.jpg"> <img src="img/numbers-02.jpg" alt=""> <p>playing with blending modes with photoshop.</p> </a> </li> <li> <a href="img/numbers-06.jpg"> <img src="img/numbers-06.jpg" alt="drips created using photoshop brushes"> <p>trying to create an 80s style.</p> </a> </li> <li> <a href="img/numbers-09.jpg"> <img src="img/numbers-09.jpg" alt=""> <p>drips created using photoshop brushes.</p> </a> </li> <li> <a href="img/numbers-12.jpg"> <img src="img/numbers-12.jpg" alt=""> <p>creating shapes using repetition.</p> </a> </li> </ul> </section> <footer> <p>Ā© 2014 Family.</p> </footer> </body> </html>

'''

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>No Regrets Family </title> <link rel="stylesheet" href="css/normalize.css"> <style> footer { color: green; } </style> </head> <body> <header> <a href="index.html"> <h1>Family Adventure</h1> <h2>Traveling the World Together</h2> </a> <nav> <ul> <li><a href="index.html">Portfolio</a></li> <li><a href="about"</li></a></li> <li><a href="contact.html">Contact</a></li> </ul> </nav> </header> <section> <ul> <li> <a href="img/numbers-01.jpg"> <img src="img/numbers-01.jpg" alt=""> <p>Experimentation with Color and Texture.</p> </a> </li> <li> <a href="img/numbers-02.jpg"> <img src="img/numbers-02.jpg" alt=""> <p>playing with blending modes with photoshop.</p> </a> </li> <li> <a href="img/numbers-06.jpg"> <img src="img/numbers-06.jpg" alt="drips created using photoshop brushes"> <p>trying to create an 80s style.</p> </a> </li> <li> <a href="img/numbers-09.jpg"> <img src="img/numbers-09.jpg" alt=""> <p>drips created using photoshop brushes.</p> </a> </li> <li> <a href="img/numbers-12.jpg"> <img src="img/numbers-12.jpg" alt=""> <p>creating shapes using repetition.</p> </a> </li> </ul> </section> <footer> <p>Ā© 2014 Family.</p> </footer> </body> </html>

'''

I'm sorry. I am painfully new and clueless. So rather than the ''' (apostrophe) I should use what? So that you can see my code and determine where I'm messing up, thank you for your help. Trying to keep on keepin' on.

Tommy Gebru
Tommy Gebru
30,164 Points

On my keyboard it is located above the tab button :-)

I have figured out my coding error. simply had capitalized my "Img" folder; changed to the appropriate "img" format and all is well with the images. I am still getting the feel for everything being just so and following the rules consistently, as you can tell. I am a scientist by training, though, so I am very much enjoying this so far :)

Tommy Gebru
Tommy Gebru
30,164 Points

Sounds great, select Best Answer to close out the discussion

thank you for your information regarding the ``` ! I will most certainly use this in the future.