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 Brent Ellingson
Brent Ellingson
286 Points

How to Build a Website: Changes made in "main.css" file do not appear when I refresh the preview website.

When I add a main.css file and place it under normalize.css file in the HTML doc, and then attempt to make stylization in the "main.css" workspace, none of the changes that I make appear when I preview the website. I have checked numerous times to make sure my code looks identical to the instructors in the video.

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

Then in "main.css" when I enter:

body { background-color: orange; }

Nothing happens. Is there some reason why my new CSS file is not linking with my HTML?

Thank you.

4 Answers

Benjamin Larson
Benjamin Larson
34,055 Points
Benjamin Larson
Benjamin Larson
34,055 Points

Are you using Workspaces to follow along? Are you making sure to save your CSS files before hitting preview? As well, post the code you are using to link your stylesheets in the HTML to see if there are any glitches there.

Jeff Lemay
Jeff Lemay
14,268 Points
Jeff Lemay
Jeff Lemay
14,268 Points

What does your stylesheet link look like? Where is your main.css file located? If it is inside a css folder and your html file is in the root directory, you'd want:

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

If you main.css file and html file are in the same folder/directory, you'd want:

<link href="main.css" rel="stylesheet" />
Benjamin Larson
Benjamin Larson
34,055 Points
Benjamin Larson
Benjamin Larson
34,055 Points

There is a link to a Markdown Cheatsheet above the "Add Comment" button for formatting things like code.

For posting code:

"Wrap your code with 3 backticks (```) on the line before and after. If you specify the language after the first set of backticks, that'll help us with syntax highlighting."

      ```html
      <p>This is code!</p>
      ```
Benjamin Larson
Benjamin Larson
34,055 Points
Benjamin Larson
Benjamin Larson
34,055 Points

Sorry you're having so much frustration Brent, but don't give up just yet! Can you snapshot your Workspace so I can check it out? With your Workspace open, find the snapshot icon in the upper right corner (it's the one all the way on the left, that looks like a little camera icon).

Benjamin Larson
Benjamin Larson
34,055 Points

Once you've created snapshot, click on it to open it in your browser and then copy and paste the link from the URL here.