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 Leia Pitcher
Leia Pitcher
1,449 Points

My picture won't show up, I've restarted and looked through other questions. Nothing works.

Here is my code: 

<!-- Be sure to change EVERYTHING on this page to make it your own! :) -->
<!DOCTYPE html>
<html lang="en">
    <head>
    <meta charset="utf-8">
    <title>All About Joy's Page</title>
    <link href='http://fonts.googleapis.com/css?family=Open+Sans' rel="stylesheet" type="text/css">
    <link href="style.css" rel="stylesheet">
  </head>   
  <body> 
    <img src="image1.jpg" alt="Leia">

    <h1>Joy Kesten</h1>

    <h2>Teacher</h2>

    <h3>San Francisco</h3>

      <h4>What I do:</h4>
         <p>I'm a teacher at Treehouse, but you should write in what you do here!</p>

    <h4>What I enjoy doing:</h4>  
      <p>When I'm not writing code, I like to surf and play music. Your turn! wWrite in something that makes you happy, or things you like to do in your free time.</p>

  </body>
</html>
Leia Pitcher
Leia Pitcher
1,449 Points

i've tried to add my screen shot, but no way to add an image

Matt Brock
Matt Brock
28,330 Points

Hey Leia, could you take a snapshot of your Workspace? Instructions here: https://teamtreehouse.com/library/previews-and-snapshots.

Austin Whipple
Austin Whipple
29,847 Points

I edited your question a bit to format the code blocks. Be sure to check out the Markdown Cheatsheet below the text editor for more information.

3 Answers

Steven Parker
Steven Parker
243,318 Points
Steven Parker
Steven Parker
243,318 Points

That's not an actual JPG image file. Unlike the image you see when you open the original joy.jpg file in the workspace, when you open this one you see lots of letters, numbers, and symbols. It's actually a text file containing the base64 encoding of your image. Without using JavaScript, to make it show up would require embedding it directly into your HTML code (prefixed with a header to indicate the data type), like this:

<img src="data:image/jpg;base64,/9j/4QOURXhpZgAATU0AKgAAAAgADAEGAAMAAAABAAIAAAEPAA
...(most of the huge encoded data omitted for brevity)...
VCzjp39qiaVAdvJJ7VE75HJwaXI27FqStdkhYdBxjvULSYOc9aY0jKuCM5qIuR8p796U0m+UtPsz//2Q==" alt="Leia">

I tried it and was able to see the image, but it makes the HTML code huge and messy. I recommend just replacing the file by uploading an actual image file instead.

Leia Pitcher
Leia Pitcher
1,449 Points
Leia Pitcher
Leia Pitcher
1,449 Points

https://w.trhou.se/7nx526d1u9

Leia Pitcher
Leia Pitcher
1,449 Points
Leia Pitcher
Leia Pitcher
1,449 Points

It is an image...but i guess for some reason the workspace doesn't like it. I've picked a new image and it seems to work.

Steven Parker
Steven Parker
243,318 Points
Steven Parker
Steven Parker
243,318 Points

It was just the wrong format to use from an external file.