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 Lauren Click
Lauren Click
1,720 Points

HTML Code Same as Example, My Website Looks Different

I'm on the Creating HTML Content, specifically adding an image gallery. My website takes me to an Index page, and the image isn't coming up.

18 Answers

Matt Trask
Matt Trask
10,027 Points
Matt Trask
Matt Trask
10,027 Points

Can you post your code so we can see it?

Lauren Click
Lauren Click
1,720 Points

'''<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Lauren Click</title> </head> <body> <header> <a href="index.html"> <h1>Lauren Click</h1> </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 Lauren Click.</p> </footer> </body> </html>'''

Lauren Click
Lauren Click
1,720 Points

When I go to comment the code, it shortens it to what you see above. How can I show the code?

Emma Willmann
.a{fill-rule:evenodd;}techdegree seal-36
Emma Willmann
Treehouse Project Reviewer

Use the backtick for posting code...which is different than a single quote. the backtick is usually on the same key as ~.

Lauren Click
Lauren Click
1,720 Points 
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Lauren Click</title>
  </head>
  <body>
    <header>
      <a href="index.html">
        <h1>Lauren Click</h1>
      </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 Lauren Click.</p>
    </footer>
  </body>
</html>
Matt Trask
Matt Trask
10,027 Points
Matt Trask
Matt Trask
10,027 Points

Look underneath the textbox and youll see a link that say "Markdown Cheatsheet" which will tell you how to replicate code here.

Matt Trask
Matt Trask
10,027 Points
Matt Trask
Matt Trask
10,027 Points

Ill testing your code now, I see a few things that can be fixed.

Matt Trask
Matt Trask
10,027 Points
Matt Trask
Matt Trask
10,027 Points 
<!DOCTYPE html> 
<html> 
<head> 
  <meta charset="utf-8"> 
  <title>Lauren Click</title> 
</head>
<body> 
  <header> 
    <a href="index.html"> <h1>Lauren Click</h1> </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 Lauren Click.</p> 
    </footer> 
  </body> 
  </html>

You say the image isnt appearing, is it in the right folder? and have you indexed the right folder?

Lauren Click
Lauren Click
1,720 Points
Lauren Click
Lauren Click
1,720 Points

Yes, I have it in the Img folder, which is inside of my "How to make a website" folder

Matt Trask
Matt Trask
10,027 Points
Matt Trask
Matt Trask
10,027 Points

ok, so you should pull everything out, and redo the folders. the top folder should be "Project" then inside you have index.html, a css file, and the img files. that should help a little.

Lauren Click
Lauren Click
1,720 Points
Lauren Click
Lauren Click
1,720 Points

Ok! I'll let you know if that works. Also, when I used your new code, it takes me to an index page. In the tutorial I'm following, it should go directly to the main page. The main page is accessible under your code by clicking on the Img. How do I move it from "Img" and have it be my main page, the first page I see when I view my website?

Lauren Click
Lauren Click
1,720 Points
Lauren Click
Lauren Click
1,720 Points

Ok! I'll let you know if that works. Also, when I used your new code, it takes me to an index page. In the tutorial I'm following, it should go directly to the main page. The main page is accessible under your code by clicking on the Img. How do I move it from "Img" and have it be my main page, the first page I see when I view my website?

Lauren Click
Lauren Click
1,720 Points
Lauren Click
Lauren Click
1,720 Points

Ok! I'll let you know if that works. Also, when I used your new code, it takes me to an index page. In the tutorial I'm following, it should go directly to the main page. The main page is accessible under your code by clicking on the Img. How do I move it from "Img" and have it be my main page, the first page I see when I view my website?

Arthur Verschaeve
Arthur Verschaeve
20,816 Points
Arthur Verschaeve
Arthur Verschaeve
20,816 Points

In the code your image's src is written with a capital I. Is that the correct name of the folder?

Matt Trask
Matt Trask
10,027 Points
Matt Trask
Matt Trask
10,027 Points

the code I made is copied from yours. The reason you get redirected is your name at the top is a link with the "index.html" link.

Matt Trask
Matt Trask
10,027 Points
Matt Trask
Matt Trask
10,027 Points

the code I made is copied from yours. The reason you get redirected is your name at the top is a link with the "index.html" link.

Lauren Click
Lauren Click
1,720 Points
Lauren Click
Lauren Click
1,720 Points

I think I'm going to start over from scratch. I'm just a beginner, so I'm trying to learn from all of my mistakes. But thank you so much for helping me!

Matt Trask
Matt Trask
10,027 Points
Matt Trask
Matt Trask
10,027 Points

well, im curious now, whats the main idea behind this lesson?

Lauren Click
Lauren Click
1,720 Points
Lauren Click
Lauren Click
1,720 Points

This is the "How to Make a Website", it's a beginner lesson.

Matt Trask
Matt Trask
10,027 Points
Matt Trask
Matt Trask
10,027 Points

hmmm this mus tbe new cause it wasnt around when i did hmtl. looks fun though

Lauren Click
Lauren Click
1,720 Points
Lauren Click
Lauren Click
1,720 Points

I like it a lot!

Matt Trask
Matt Trask
10,027 Points
Matt Trask
Matt Trask
10,027 Points

if you need any help, feel free to ask!