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 Elizabeth Park
Elizabeth Park
Courses Plus Student 30 Points

CSS not working on HTML doc

I correctly linked my CSS stylesheet to my main index2.html file. But the changes I made in my CSS file is not showing up when I load the page. I'm not sure what I'm doing wrong. I used the developer tools>resources to see what is being loaded and my CSS file is not showing up even though it is in the same folder as my index2.html with the correct route.

This is the code for the head of my index2.html file

   <head> <!--contains general info about doc  -->
    <meta charset="UTF-8" />
    <title> UCSD Phi Alpha Delta</title>
    <link href="pad_styles.css" rel="stylessheet" type="text/css"/>
    <script src="modernizr-1.5.js"></script>
</head>

4 Answers

Jason Anders
MOD
Jason Anders
Treehouse Moderator 145,858 Points
Jason Anders
Jason Anders
Treehouse Moderator 145,858 Points

Hi Elizabeth,

The trailing slash doesn't actually make a difference. <link> is a self closing tag, so you can put it there or not. The convention in HTML is not, but in XML it is absolutely required to be there, or you will receive an error. (XML is far more strict than HTML)

You sheet is not linking, because there is a typo in the line. You have stylessheet with an extra 's' that is pluralizing "styles". If you fix that up (just 'stylesheet'), it should solve your problem.

:) :dizzy:

Robert Bennett
Robert Bennett
11,927 Points
Robert Bennett
Robert Bennett
11,927 Points

That is why I put up a clean copy of the code.. Read what I said... It has the link rel="stylesheet!!! All they would have to do is fill out what needed to be filled out...

Elizabeth Park
Elizabeth Park
Courses Plus Student 30 Points

Thank you so much! I don't know why I didn't see that

Jason Anders
Jason Anders
Treehouse Moderator 145,858 Points
Jason Anders
Jason Anders
Treehouse Moderator 145,858 Points

Robert Bennett

Yes, your 'clean code' has the correct answer, but you didn't explain why your code works and her code doesn't. One cannot learn from their mistakes if they just copy / paste answers to pass a challenge and aren't given an explanation of the provided code / snippet. The Treehouse Community does not support copy / paste responses, as it doesn't provide a productive teaching environment.
Also, you pointed out and implied the extra / in the statement as being incorrect, when in fact, it is not. While the slash is not needed in HTML (but very much needed in XML), it is fine and correct in being there and will not cause any errors.

So, yes, I did "read" your response, but it was partly incorrect and incomplete, in that it did not include any explanations.

:dizzy:

Robert Bennett
Robert Bennett
11,927 Points
Robert Bennett
Robert Bennett
11,927 Points

<link href="pad_styles.css" rel="stylessheet" type="text/css"/>

You have an extra / in the end of the statement type="text/css"/>

Here is a clean code to help guide you! <link rel="stylesheet" type="text/css" href="mystyle.css">

Elizabeth Park
Elizabeth Park
Courses Plus Student 30 Points

I thought the /> was necessary for closing the link tag? I've been using that in previous html files to link to my css stylesheet and it always worked. But I went ahead and took out the extra / to see if anything would change but my css is still not linking to my html file :/

Robert Bennett
Robert Bennett
11,927 Points
Robert Bennett
Robert Bennett
11,927 Points

Have you tried to fill it out this way <link rel="stylesheet" type="text/css" href="pad_styles.css">

I just looked up the code for it - here is what it says,"

End tags must have the following format:

The first character of an end tag must be a "<" (U+003C) character.
The second character of an end tag must be a "/" (U+002F) character.
The next few characters of an end tag must be the element's tag name.
After the tag name, there may be one or more space characters.
Finally, end tags must be closed by a ">" (U+003E) character."

This is a good chat.. lets us know which way it went...

Elizabeth Park
Elizabeth Park
Courses Plus Student 30 Points

Hi Robert,

I corrected the link tag by getting rid of the extra 's' in stylesheet. I decided to keep the ending link tag as '/>' since my professor prefers we code in XHTML. Thank you for your response.