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

General Discussion

Linking CSS file to HTML file

I am having problems in my workspace linking my CSS to HTML - it's just not linking. Here is my code:

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

I have also made sure the CSS files are sitting in the CSS folder. Any suggestions?

18 Answers

Code hasn't popped up. Make sure you hit spacebar 4 times and then past or type code. It'll be formatted like code then, easier to read.

Woops...here is the code:

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

I'm not sure to be honest. Can workspaces be shared and linked to?

A user's workspace is (currently) only accessible only when that user is logged in.

> Can workspaces be shared and linked to?

So not really.

Yeh I was wondering the same thing about sharing workspaces...I hope so as I am stuck until I can resolve this!

I haven't used them myself but there is a preview url that some people have posted in the forums to share their workspace.

if you go to your workspace and open the file up and click the eye on they right it will share what you have made but not the code that you have written.

did you make sure that the code was within the head element?

Yes the code is in the head element. Here is what it looks it, may have stuffed something up there?

<head>
<meta charset="utf-8">
<title>Teri Nolan | Family Photo Taker</title>
<link rel="stylesheet" href="css/normalize.css">
<link rel="stylesheet" href="css/main.css">

</head> <body> <header>

It seems I'm not the only one with this exact problem, in the "How to Make a Website' course

https://teamtreehouse.com/forum/css-is-not-linking-to-html

<head>
  <title> Teri Nolan | Family Photo Taker</title>
  <link rel="stylesheet" href="css/normalize.css">
  < link rel="stylesheet" href="css/main.css">
 </head>

Thanks, my code didn't paste properly, I think it actually is nested, here it is again....

''' <html> <head> <meta charset="utf-8"> <title>Teri Nolan | Family Photo Taker</title> <link rel="stylesheet" href="css/normalize.css"> <link rel="stylesheet" href="css/main.css"> </head> <body> <header> '''

hmmm, can;t get it to paste!

if you are trying to paste the code press the space bar 4 times before entering the code

<html> <head> <meta charset="utf-8"> <title>Teri Nolan | Family Photo Taker</title> <link rel="stylesheet" href="css/normalize.css"> <link rel="stylesheet" href="css/main.css"> </head>

<html>
  <head>
    <meta charset="utf-8">
    <title>Teri Nolan | Family Photo Taker</title>
    <link rel="stylesheet" href="css/normalize.css">
    <link rel="stylesheet" href="css/main.css">
  </head>
<body>

Sorry - trying to paste the code with the 4 spaces in front, but it's not happening (which is strange because that's how I pasted my code 5 hours ago...)

Fixed it for you, you have to use 4 spaces in front of every line of code.

Check out this thread for examples of the various ways to type code in the forum for some examples.

Hi Teri, just wondering if your css folder is on the same level as your index.html folder? Or did you put index.html in another folder?

Hi Diane, yep my CSS folder is the same level as my index.html. And inside my CSS folder are two files - main.css and normalize.css

There must be something wrong with the css file - can you post the main.css code? (this is driving me crazy, so it must be REALLY driving you crazy!)

It sure is! The normalise.css file was given to us to download as part of the course. When I linked that file I knew it wasn't working properly because in my preview my links still had bullet points (whereas the instructor's didn't). The main.css file is the first bit of CSS code I have written. Again, I could tell it didn't link because it did not change the background colour in my preview. Here is the CSS that I wrote:

body {
  background-color: orange;
}

You wrote "normalise.css" just now, but your html has "normalize.css". Make sure they're the same.

Nice pick up! But alas, all reference to the file is spelled - normalize.css in the workspace.

Have you tried your files locally on your own computer? At least you could eliminate whether it's a problem with your files or a workspace problem.

Thanks Jason, I just did that and it worked! When I open the files locally on Chrome the page looks exactly how it should! So it is a workspace issue.

If you'd like to continue using workspaces then you might try deleting that workspace, creating a new one, and upload those local files that you have. Then see if it works properly.