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

Posted by Tanner Nielsen
Tanner Nielsen
927 Points

problem with pictures

i started the css part of the website project and something happened all my pictures arent showing. it is just a small blue box with a question mark inside it... can anyone help

7 Answers

Nachiket Kumar
Nachiket Kumar
3,590 Points
Nachiket Kumar
Nachiket Kumar
3,590 Points

This usually means that your images aren't in the exact location that you have specified in your markup. Double check the path to the images folder and make sure you didn't move the main images folder! Posting your code might help us too...

Tanner Nielsen
Tanner Nielsen
927 Points

i posted it

Tanner Nielsen
Tanner Nielsen
927 Points
Tanner Nielsen
Tanner Nielsen
927 Points

<!DOCTYPE HTML> <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"/> <title>YourFit®' Pants and Shoes</title> </head> <body> <img src="pics/logo.jpg" alt="Levis"> <ul class="nav"> <li><a href="#">About</a></li> <li><a href="#">Pants and Prices</a></li> <li><a href="#">Locations</a></li> <li class="last"><a href="#">Contact Us</a></li> </ul>

<div id="intro">
 <h1>We carry all kinds of styles and sizes, in both pants and shoes. We also have the best Selection in the Northwest!</h1>
 <p><a href="#" class="btn">Browse Our Styles</a></p>
</div>

<img src="pics/styles.jpg" alt="Styles">

<div>
 <h2>Whats Popular?</h2>
 <p>The Classic Levis&reg; 501 </p>
 <img src="pics/501.jpg" alt="501">
</div>

<div id="New Shoes">
 <h2>Keep your feet Fresh</h2>
 <p>Now Selling <a href="#">Toms&reg;</a></p>
 <img src="pics/toms.jpg" alt="Toms">
</div>

<h2>Our Goal Here at YourFit&reg;</h2>
 <p>Our goal is very simple, and that is to fit every person in the most comfortable and stylish pair of pants and shoes. We also Take Pride in providing some of the best prices and deals in the northwest, and will continue that trend thanks to our loyal customers!</p> 


<h2>Inside The Pocket</h2>
 <p>YourFit&reg; was created do to my personal experience shopping for Pants and Shoes at major retailers, i didn't enjoy dealing with shark like salesman and pushy employees. Thats why here at YourFit&reg; we strive to give you the best customer service and most comfortable experience every time you walk in our store! We do that by not pushing you into buying items you dont wants and by treating you as if you were family. so next time you come in give the cashier the <strong>promotional code:358758983284</strong> to get a 10% discount off your next purchase. thank you!
 <p><a href="#" class="btn-small">Print out <strong>Promotional Code</strong>Here!</a></p>
<h2>Get Fitted With Us</h2>

<div id="contact">
 <p>Call us: <span>1-555-get-fitt</span><br>
 <p>Email us: <a href="#">GetFitted@YourFit.com</a>
</div>

 <p> We announce all our new styles first through our twitter page!</p>
 <a href="http://www.twitter.com/#!/YourFit"><img src="pics/twitter.jpg" alt="Twitter"></a>

<div id="copyright">
 <p> &copy; 2013 YourFit' Pants and Shoes. All Rights Reserved.</p>
</div>

</body> </html>

Nachiket Kumar
Nachiket Kumar
3,590 Points
Nachiket Kumar
Nachiket Kumar
3,590 Points

What is your directory structure? Where is your 'pics' folder stored in relation to this html file?

Tanner Nielsen
Tanner Nielsen
927 Points
Tanner Nielsen
Tanner Nielsen
927 Points

i have then in a folder called pics, inside another folder called my folder, on my dashboard( i have a couple folders related to the code in that folder)

Nachiket Kumar
Nachiket Kumar
3,590 Points
Nachiket Kumar
Nachiket Kumar
3,590 Points

This should be your basic folder structure for a website project:

  • Main folder (the following are all inside this folder)
  • pics folder
  • js folder (for any javascript)
  • css folder (for your css files)
  • page1.html
  • page2.html
  • etc...

If your structure is like this, then you should be able to use the path the way you are using it. If it's different, i.e. the html files are stored in another folder, then you will have to account for that, or re-organize your folder the way I have suggested.

Ashley Omnas
Ashley Omnas
5,881 Points
Ashley Omnas
Ashley Omnas
5,881 Points

I'm not sure if you solved your problem yet, but I had an issue the other day where my image wasn't showing up in the browser. I was getting extremely frustrated because all of my code was right on. My problem was that I accidentally named my image picture.jpg instead of just picture. This caused my image to have the name of 'picture.jpg' with the file extension of .jpg (picture.jpg.jpg).

Tanner Nielsen
Tanner Nielsen
927 Points
Tanner Nielsen
Tanner Nielsen
927 Points

got it under control, thanks for all the help!!! what was wrong is i had my images folder not in the same folder and my html document once i dropped it in the folder containing the documents i refreshed the page and it worked so i guess that was the problem! thanks again!