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
Rob Edworthy
950 PointsPicture not displaying correctly
My code is the the same as the instructors as below, I have also created the img folder and copied the files etc. But instead of the large picture that he displays, I get a small broken picture icon. ''' <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Rob Edworthy | Designer</title> </head> <body> <header> <a href="index.html"> <h1>Rob Edworthy</h1> <h2>Designer</h2> </a> <nav> <ul> <li><a href="index.html">Portfolio</a></li> <li><a href="about.html">About</a></li> <li><a href="contact.html">Contact</a></li> </ul> </nav> </header> <section> <ul> <li> <img src="img/numbers-01.jpg" alt=""> </li> </ul> </section> <footer> <p>© 2015 Rob Edworthy.</p> </footer> </body> </html> '''
Rob Edworthy
950 PointsIt opens correctly from with the img folder in workspace.
tootiemcflow
5,601 PointsCan you create a Snapshot of your Workspace? So that I may take a closer look.
Mark VonGyer
21,239 PointsCode looks fine. Is the image in the correct folder?
Is your HTML file in the main folder?
Is the image .jpg?
Rob Edworthy
950 PointsYes according to the instruction, create a img in the root of the file structure place the jpg in it. The index.html is also at the root level.
tootiemcflow
5,601 Points@robedworthy I downloaded your workspace to test locally and everything works fine. I'm not too sure what's wrong. Maybe a workspaces issue...
I recommend try launching a new workspace from Structure the Image Gallery and working from there.
-Edit: I did just that with your original source code and everything worked.
Rob Edworthy
950 PointsThanks robby, I'll give that a try in the morning. Have just turned the pc off, will update this then.
7 Answers
Joy Kesten
Treehouse Guest TeacherRob Edworthy in your snapshot it looks like there is an uppercase "I" on the folder title and a lowercase "i" in the path to the file in your image tag. Making the case the same, either one works, should do the trick. Let me know if it doesn't
<img src="Img/numbers-01.jpg" alt="">
tootiemcflow
5,601 PointsHa, I can't believe I didn't noticed that...
Rob Edworthy
950 PointsThanks Joy, so need to check more carefully for typos. ☺️
Joy Kesten
Treehouse Guest Teacher:) My pleasure, it's aways the littlest things!
Daisy Lloyd
1,472 PointsI did exactly the same thing - I had a lower case 'i' when my folder had an upper case 'I'...glad I read this as I was getting very frustrated about why it wasn't working!
Yamin Chen
358 PointsI have the same problem.
Yamin Chen
358 PointsHow do I upload the snapshot to show you? Please help.
channonhall
12,247 Pointsclick the camera icon on the top rigth corner
Joy Kesten
Treehouse Guest TeacherYup Yamin Chen it's hard to help until we can see what you're working on. Let us know if you need more help with the snapshot.
Yamin Chen
358 PointsHere is my snapshot.
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Jason Chen | QA Tech </title> </head> <body> <header> <a href="index.html"> <h1>Jason Chen</h1> <h2>QA TECH</h2> </a> <nav> <ul> <li><a href="index.html">Portfolio</a></li> <li><a href="about.html">About</a></li> <li><a href="contact.html">Contac</a></li> </ul> </nav> </header> <section> <ul> <li> <img src="img/numbers-01.jpg" alt=""> </li> </ul> </section> <footer> <p>© 2015 Jason Chen.</p> </footer> </body> </html>
Yamin Chen
358 PointsI read a few post again and finally figured it out. The folder I named image instead of img. So I renamed the folder and refresh. Got it! It feels great when I see the pictures. Thanks a lot!!!
tootiemcflow
5,601 Pointstootiemcflow
5,601 PointsHmm, everything looks okay...
If you actually select the image
numbers-01.jpgin theimgfolder within Workspaces. Do you see the image there? Or is it still a broken image? If that's the case you could try deleting the image from Workspaces and reuploading.