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 CSS: Cascading Style Sheets What is CSS?

In HTML, <link> not connecting to the CSS stylesheet. Can someone please help me connect it?

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>John Gray | Designer</title> <link rel="stylesheet" href="css/normalize.css"> <style> footer { color: green; } </style> </head> <body> <header> <a href="index.html"> <h1>John Gray</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>Experimenatation 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>Creating an 80's style of glows.</p> </a> </li> <li> <a href="img/numbers-09.jpg"> <img src="img/numbers-09.jpg" alt=""> <p>Drips created using photoshop brushes.</p> </a> </li> <li> <a href="img/numbers-12.jpg"> <img src="img/numbers-12.jpg" alt=""> <p>Creating shapes with repetition.</p> </a> </li> </ul> </section> <footer> <a href="http://twitter.com/"><img src="img/twitter-wrap.png" alt "Twitter Logo"></a> <a href="http://facebook.com/"><img src="img/facebook-wrap.png" alt "Facebook Logo"></a> <p>Ā© 2016 John Gray</p> </footer> </body> </html>

4 Answers

<link rel="stylesheet" href="css/normalize.css">

This code looks fine. My first guess would be that "normalize.css" may not be in a folder named css... but in the main folder maybe? ... or missing?

To the left of my workspace I have a folder named "css" and I dropped the "normalize.css" file into it and it pops up with a bunch of information about style. Does it need to be in a folder named css on my laptop?

You could take the link out and compare to see if it's doing anything. It may be the file has changed since the video was made, I'm not sure.

make sure the file name is correct,

Are you having the problem on your laptop? Or are you working in Workspaces? They would both need the css folder with the normalize.css file in them to work. If you are working on your laptop then you just need to make sure that the link points to the folder where your file is - so you can make a css folder and put the file there, or get rid of the css/ part of the link if the file is in your main folder. Either way should work, it's up to you which you prefer to use. I think a lot of people find the css folder helps keep things organized as the websites get larger, but on small sites keeping files in the main folder isn't usually a problem.

I'm having the issue on Workspace... I'm trying to learn how to do front end web development so I would really like to be able to learn the css way! As far as I can tell my info looks exactly the same as the videos, but I'm getting different results. Maybe the normalize.css is outdated? The video is from 2014.

Update: I can't tell you how but it just started to work. Thank you for your help!