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 Use ID Selectors

external css style sheet doesn't work

So I have put the main.css inside of my css folder and added the link in my index.html, like this "<link rel="stylesheet" href="css/main.css">". However, it just doesn't do anything like the CSS style sheet is not there.

2 Answers

Well, that's not how you'd add a link. By putting " " you're essentially linking it to nowhere. This is how you'd make a proper external link:

relative link: the/path/to/stylesheet.css you use relative links to find files uploaded on your server

absolute link: http://www.wehavestylesheets.com/external/stylesheets/stylesheet.css you use absolute links to find files on other servers

I'd recommend always using relative links, in case the site you're linking it to goes down.

Here's a visual representation of the difference between absolute and relative:

Absolute = ADDRESS OF WEBSITE + "THE RELATIVE" LOCATION

http://www.wehavestylesheets.com/.com/content/to/be/found

Relative = JUST "THE RELATIVE" LOCATION

linking/to/a/file/in/my/server.css

Thanks. I understand what you are saying. But I am doing it in the workspace and I have everything under the workspace directory. Somehow it works right now. I didn't change anything. Maybe it is a problem with workspace. Anyway, thank you.

Stacy Fabian
Stacy Fabian
2,246 Points

Hey Iris,

So you would put in something like this...

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

That's assuming you named your css sheet "main.css".

Or if you were trying to link to the "responsive.css" sheet (you might not be there in the lesson yet), you'd do...

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

Basically, you have to tell it where to link to by typing out the name of your css sheet.

Does that help?

Stacy