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 How to Make a Website CSS: Cascading Style Sheets Center the Wrapper

Max Messmer
Max Messmer
11,386 Points
Posted by Max Messmer
Max Messmer
11,386 Points

Anything look wrong here?

For some reason when I preview my code in workspace it shows up as "Index of/ ../ css/ img/ ", with img/ linking me to my 'site'. Even then, the images are all broken with the exception of the Facebook logo, and there is no styling. I can't find anything wrong with my html or css, and I'm pretty sure I've saved everything correctly as well. Any ideas? Thanks!!!

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>John M Messmer | Developer</title>
    <link rel="stylesheet" href="css/normalize.css">
    <link rel="stylesheet" href="css/main.css">
  </head>
  <body>
    <header>
      <a href="index.html">
        <h1>John M Messmer</h1>
        <h2>Developer</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>
    <div id="wrapper">
      <section>
       <ul>
         <li>
           <a href="img/numbers-01.jpg">
              <img src="img/numbers-01.jpg" alt="">
                <p>Experimentation with color and     texture.</p>
             </a>
          </li>
         <li>
           <a href="img/numbers-02.jpg">
              <img src="img/numbers-02.jpg" alt="">
                <p>Playing with blending modes in Photoshop.</p>
             </a>
          </li>
         <li>
           <a href="img/numbers-06.jpg">
              <img src="img/numbers-06.jpg" alt="">
                <p>Trying to create 80's stuff.</p>
             </a>
          </li>
         <li>
           <a href="img/numbers-09.jpg">
              <img src="img/numbers-09.jpg" alt="">
                <p>Created using photoshop brushes.</p>
             </a>
          </li>
         <li>
           <a href="img/numbers-12.jpg">
              <img src="img/numbers-12.jpg" alt="">
                <p>Creating shapes using repetition.</p>
             </a>
          </li>
         </ul>
      </section>
          <footer>
            <a href="http://twitter.com/max__mess"><img src="img/twitter-wrap.png" alt="Twit Logo"></a>
            <a href="http://facebook.com/aldouswhitman"><img src="facebook-wrap.png" alt="FB logo"></a>
            <p>&copy; 2014 A.D. John M Messmer.</p>
          </footer>
      </div>
      </body>
</html>```

```css
a {
text-decoration: none;
}

#wrapper{
max-width: 940px;
  margin: 0 auto;
  background: orange;
}```

3 Answers

Andrew Moore
Andrew Moore
21,076 Points
Andrew Moore
Andrew Moore
21,076 Points

John, I think the problem is that your index.html file is saved in your img folder, rather than the root folder. You mentioned that only the facebook image works, it's also the only one referenced by just an image filename without "img/"

Shawn Flanigan
PLUS
Shawn Flanigan
Courses Plus Student 15,815 Points
Shawn Flanigan
Shawn Flanigan
Courses Plus Student 15,815 Points

John:

Is your file titled index.html or just index? If you leave off the .html bit, this kind of error will occur.

To rename your file in Workspaces, just right-click on the file in your file tree and choose "Rename".

Hope that helps!

Max Messmer
Max Messmer
11,386 Points
Max Messmer
Max Messmer
11,386 Points

Shawn,

Thanks for the reply. It is saved as "index.html", so that's unfortunately not the problem.

Max Messmer
Max Messmer
11,386 Points
Max Messmer
Max Messmer
11,386 Points

Andrew,

You are right. Thanks for the help!

Andrew Moore
Andrew Moore
21,076 Points
Andrew Moore
Andrew Moore
21,076 Points

No problem, glad I could help!