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 Structure the Image Gallery

Posted by Emmanuelle Stahler
Emmanuelle Stahler
338 Points

structuring the image gallery

Hello, when I hit 'preview' my image comes up as an image file but the image itself does not show. My code is:

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Emma Steel | Writer</title> </head> <body> <header> <a href="index.html"> <h1> Emma Steel</h1> <h2>Writer</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>© 2014 Emma Steel.</p> </footer> </body> </html>

Does anyone know what is wrong that the image did not show up? I also tried putting in the whole url so that it was not relative and I got the same result which was the preview of the website but the image does not show up - just a placeholder saying there's an image there.

Thank you for your help

4 Answers

Emmanuelle Stahler
Emmanuelle Stahler
338 Points
Emmanuelle Stahler
Emmanuelle Stahler
338 Points

Hi sorry about that, all my code didn't transfer into my question. Here is the relevant piece: </header> <section> <ul> <li> <img src="img/numbers-01.jpg" alt=""> </a> </li>

Emmanuelle Stahler
Emmanuelle Stahler
338 Points

It doesn't tend to want to let me copy paste my source code.... which is too bad because to me my code looks exactly like what you've posted but I've an untutored eye which was why I was hoping for help.

Dustin Matlock
Dustin Matlock
33,856 Points

This is how you'd post a code block. Refer also to this source

Posting Code

Dustin Matlock
Dustin Matlock
33,856 Points
Dustin Matlock
Dustin Matlock
33,856 Points

Looks like you need some more code to make it work. Either that or your post did not come all the way through.

Have you tried downloading the project files and looking at the code?

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Nick Pettit | Designer</title>
  </head>
  <body>
    <header>
      <a href="index.html">
        <h1>Nick Pettit</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>&copy; 2014 Nick Pettit.</p>
    </footer>
  </body>
</html>
Emmanuelle Stahler
Emmanuelle Stahler
338 Points
Emmanuelle Stahler
Emmanuelle Stahler
338 Points

I hit copy and pasted it into this screen and it comes up when I'm typing the question but when I send it in for discussion it doesn't come out. <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Emma Steel | Writer</title> </head> <body> <header> <a href="index.html"> <h1> Emma Steel</h1> <h2>Writer</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> <a href="img/numbers-01.jpg"> <img src="img/numbers-01.jpg" alt=""> <p>Experimentationwith color and tecture.</p> </a> </li> <li> <a href="img/numbers-02.jpg"> <img src="img/numbers-02.jpg" alt=""> <p>Experimentation with color and texture.</p> </a> </li> <li> <a href="img/numbers-06.jpg"> <img src="img/numbers-06.jpg" alt=""> <p>Playing with blending modes in Photoshop.</p> </a> </li> <li> <a href="img/numbers-09.jpg"> <img src="img/numbers-09.jpg" alt=""> <p>Trying to create an 80's style of glows.</p> </a> </li> <li> <a href="img/numbers-12.jpg"> <img src="img/numbers-12.jpg" alt=""> <p>Drips created using Photoshop brushes.</p> </a> </li>
</ul> </section> <footer> <p>© 2014 Emma Steel.</p> </footer> </body> </html> Trying it again here. Do i need to use a different browser do you think?

Dustin Matlock
Dustin Matlock
33,856 Points

Where are you copying from and how does it appear when pasted?

Emmanuelle Stahler
Emmanuelle Stahler
338 Points
Emmanuelle Stahler
Emmanuelle Stahler
338 Points

I'm copying from the workspace and when I past it it appears as thought it's plain text / unformatted but still with the spacing and lines that are in the original. But clearly it's only sending through the english words rather than any of the html or css that appears when I paste.

Dustin Matlock
Dustin Matlock
33,856 Points

Trying posting from the workspace to a code editor, and then to the forum.