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 Casey Mathews
Casey Mathews
4,740 Points

Trouble linking CSS and displaying images on page

I'm working through the Making a Website course. Early on, I noticed that my images are not showing up on the page preview like the course instructors, though my links go to the images. I've checked my code against what I see of his and am not catching the differences. Also, my CSS documents are not linking. I've got normalize.css and main.css saved in the same folder but no changes are showing up to my preview page. Any suggestions? Thanks!

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Casey Mathews | Designer</title> <link rel="stylesheet" href="css/normalize.css"> <link rel="stylesheet" href="css/main.css"> </head> <body> <header> <a href="index.html"> <h1>Casey Mathews</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> <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 style glows.</p>
           </a>
        </li> 

        <li>
          <a href="img/numbers-09.jpg"
            <img src="img/numbers-09.jpg" alt="">
            <p>Drips with Photoshop brushes.</p>
           </a>
        </li> 

        <li>
          <a href="img/numbers-12.jpg"
            <img src="img/numbers-12.jpg" alt="">
            <p>Creating shapes using repitition.</p>
           </a>
        </li> 

      </ul>
    </section>
    <footer>
      <a href="http://twitter.com/nickrp"><img src="img/twitter-wrap.png" alt="Twitter Logo"> </a>
      <a href="http://facebook.com/nickpettit"><img src="img/facebook-wrap.png" alt="Facebook Logo"></a>
      <p>&copy; 2016 Casey Mathews.</p>
    </footer>
</body>

</html>

Tushar Singh
Tushar Singh
Courses Plus Student 8,692 Points

syntax error--anchor tags

<!-- your code-->
<a href="img/numbers-12.jpg"

<!--- it should be like this
<a href="img/numbers-12.jpg">   <!-- missing ">"-->

As you can see my code is also saying syntax error because i din't use the anchor tag properly.

3 Answers

Roger Schaeffer
Roger Schaeffer
2,144 Points

One other thing you must watch out for is that the file names are "case sensitive". If you accidentally capitalize a letter of the file name (even though it is still spelled the same) that file will not be displayed.

Kody Bentley
Kody Bentley
4,411 Points
Kody Bentley
Kody Bentley
4,411 Points

Hello,

Not sure if this is the fix to the issue but it looks like you have a syntax error on all of your <a> tags for example:

<a href="img/numbers-12.jpg"

^^ You are missing the closing > for all of your anchors.

For your CSS issues are you sure you have the folders saved correctly in the directory? Make sure your CSS is saved in the CSS folder and under the names you have called in index.html so it would be main.css and normalize.css.

If that does not fix the issue, maybe post your CSS code so we can have a look?

Let me know if that fixed the problem.

Good luck and happy coding!

Casey Mathews
Casey Mathews
4,740 Points
Casey Mathews
Casey Mathews
4,740 Points

Thanks everyone! I think the capitalization issue was my main offense, but the syntax errors needed correcting also. Seems to be working fine now. Cheers!