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

Problems with Preview using Workspace

I'm using workspace and every time I try to preview my work in Chrome, this comes up:

Index of /

css/ img/

Can anyone help? I can't see if what I'm coding works.

Is the index.html file in the same place you see css/ and img/ It needs to be above those. I don't see any of your other html files above either.

6 Answers

Do you have an index page?

Yes I do. Below is the code:

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Nerinna Valera | Photographer & Designer</title> <link rel="stylesheet" href="css/normalize.css"> <link href='https://fonts.googleapis.com/css?family=Changa+One|Open+Sans:400,400italic,700,700italic,800|Open+Sans+Condensed:300' rel='stylesheet' type='text/css'> <link rel="stylesheet" href="css/main.css"> <link rel="stylesheet" href="css/responsive.css"> </head> <body> <header> <a href="index.html" id="logo"> <h1>Nerinna Valera</h1> <h2>Photographer & Designer</h2> </a> <nav> <ul> <li><a href="index.html" class="selected">Portfolio</a></li> <li><a href="about.html">About</a></li> <li><a href="contact.html">Contact</a></li> </ul> </nav> </header> <div id="wrapper"> <section> <ul id="gallery"> <li> <a href="img/002.jpg"> <img src="img/002.jpg" alt=""> <p>Shauna and Chris</p> </a> </li> <li> <a href="img/003.jpg"> <img src="img/003.jpg" alt=""> <p>Shauna and Chris</p> </a> </li> <li> <a href="img/004.jpg"> <img src="img/004.jpg" alt=""> <p>Shauna and Chris</p> </a> </li> <li> <a href="img/005.jpg"> <img src="img/005.jpg" alt=""> <p>Shauna and Chris</p> </a> </li> <li> <a href="img/006.jpg"> <img src="img/006.jpg" alt=""> <p>Shauna and chris</p> </a> </li>
</ul> </section> <footer> <a href="https://twitter.com/nerinna_valera"><img src="img/twitter-wrap.png" alt="Twitter Logo" class="social-icon"></a> <a href="https://www.facebook.com/nerinna.photography/"><img src="img/facebook-wrap.png" alt="Facebook Logo" class="social-icon"></a>
<p>© 2016 Nerinna Valera</p> </footer> </div> </body> </html>

Okay.... From the top
<!DOCTYPE html>
<html>
<head>


</head> after last link
<body> next
<header>

</header>

</body> at the end
</html>

make sure it is named index.html

you need all your html files in the same place you see Index of/ and you still need the parts above in your files

Let me know if that works for you.

Thanks Craig. It's named index.html and it still doesn't work. I've been using Sublime Text instead of workspace and it works in preview mode when I use sublime text.

You should see index.html, about.html, contact.html all in the same directory where you see css/ and img/

Hi Craig, I have it set that way. My folder structure looks like this:

about.html contact.html css (this is a folder with my css files) img (this folder has all my images) index.html

It has to be something simple.  You do need those other parts in your files.  Then your tree should be straightforward.

index.html contact.html about.html  css     img   
                                         |         |
                                      .css    .jpg

I wish you could just post zip of them :)

I have exactly the same problem. Has anyone got the answer?