Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

CSS Treehouse Club: CSS My First Web Page Color Keywords, Hex Colors, and Font Families

Changes in workspace not appearing on web page "Im using Chrome"

Hi all, I am not seeing specific changes made to my workspace when loading the preview page. The ones I'm not seeing are my image, top bar colour/ topr bar is missing and background colour not showing up. The writing changes I have made all work. I have tried refreshing my browser once the page is loaded with no luck. I have tried downloading workspace but my computer keeps telling me it cant be unarchived? The names of the index and css files are in lowercase as well.

Any help will be appreciated.

Here is my index.html;

<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>All About Stan's Page</title> <link href='http://fonts.googleapis.com/css?family=Open+Sans' rel="stylesheet" type="text/css"> <link href="style.css" rel="stylesheet"> </head>
<body> <img src="stan.jpg"alt="Stanislav">

<h1>Stanislav Amdur</h1>

<h2>Web Developer</h2>

<h3>Vancouver, BC</h3>

  <h4>What I do:</h4>
     <p>I am a film industry worker and a part time web developer.</p>

<h4>What I enjoy doing:</h4>  
  <p>When I'm enjoying myself I am usually writing code.</p>

</body> </html>

and here is my style.css

/*********************************************** Top bar color ***********************************************/

html { background-color: red border-top: 100px solid #2A15A8; }

/*********************************************** Body styling ***********************************************/

body { max-width: 600px; margin: 20 auto; padding: 40px 40px; font-size: 1.3em; line-height: 1.6em; font-family: 'Open Sans', sans-serif; color: #777; font-weight: 300; }

/*********************************************** Image styling ***********************************************/

img { border-radius: 20%; max-width: 340px; }

/*********************************************** Headline styling ***********************************************/ h1 { font-size: 1.2em; line-height: .5em; color: #564581; }

h2 { font-size: 1em; line-height: 1em; font-style: oblique; color: #aaa;

}

h3 { font-size: .875em; line-height: 1em; font-weight: normal; }

h4 { margin-top: 60px; font-weight: 500; color: #564581; }

2 Answers

Liam Ferb
Liam Ferb
8,454 Points

I'm not particularly sure, but some possible problems / solutions would be:

  • You're not refreshing the browser / click the refresh button or do ctrl + r (cmd + r o mac)
  • You forgot to save your workspace / ctrl/cmd s (in the workspace tab)
  • You looked for one thing changing but in actually, something you didn't notice changed / just double check your code, or if you're not sure what what you changed did, just ask.

Hope This Helps!

Hey Stanislav,

One thing I can suggest you try is turning on your Chrome developer tools before you refresh the browser, this will make sure the page is definitely loaded from the server and not from the browser cache. Probably the first thing you did but have you tried clearing the cache? Also double check your image file path just incase thats the problem.

If you add your code to [https://jsfiddle.net/] or something similar it can be helpful for others to work out what the problem might be :) Hope you find a solution!