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

HTML How to Make a Website CSS: Cascading Style Sheets Use ID Selectors

Kharym Rasool
Kharym Rasool
1,453 Points

Background color failing to change, code seems correct

All code appears correct however web page just not changing color, any help is appreciated

6 Answers

Julian Aramburu
Julian Aramburu
11,368 Points

Glad to hear! Keep coding! Everybody makes mistakes :D! Dont worry too much about it! GOGO!

Kharym Rasool
Kharym Rasool
1,453 Points

Main.css code

body { background-color: orange; }

Kharym Rasool
Kharym Rasool
1,453 Points

index.html code

<!DOCTYPE html>

<html> <head> <meta charset="utf-8"> <title>Kharym Rasool | Not an entrepreneur</title> <link rel="stylesheet" href="css/normalize.css">
<link rel="stylesheet" href="css/main.css">
</head> <body> <header> <a href="index.html"> <h1>Kharym Rasool</h1> <h2>Not an entrepreneur</h2> </a> <nav> <ul> <li><a href="index.html">Portfolio</a></li> <li><a href="about.html">About</a></li> <li><a href="contact.html">Contact</a></li> </ul> </nav> </header> <section> <ul> <li> <a href="img/numbers-01.jpg"> <img src="img/numbers-01.jpg" alt=""> <p>Experimentation with color and texture.</p> </a> </li> <li> <a href="img/numbers-01.jpg"> <img src="img/numbers-02.jpg" alt=""> <p>Playing with blending modes in photoshop.</p> </a> </li> <li> <a href="img/numbers-06.jpg"> <img src="img/numbers-06.jpg" alt=""> <p>Trying to create a period style of glows.</p> </a> </li> <li> <a href="img/numbers-09.jpg"> <img src="img/numbers-09.jpg" alt=""> <p>Drips created in photoshop brushes.</p> </a> </li> <li> <a href="img/numbers-12.jpg"> <img src="img/numbers-12.jpg" alt=""> <p>Creating shapes using repetition.</p> </a> </li> </ul> </section> <footer> <a href="http://twitter.com/kharymr_"><img src="img/twitter-wrap.png" alt="Twitter Logo"></a> <a href="http://facebook.com/kharymrasool"><img src="img/facebook-wrap.png" alt="Facebook Logo"></a> <p>Ā© 2015 Kharym Rasool. </p> </footer> </body> </html>

Kharym Rasool
Kharym Rasool
1,453 Points

the code missing in terms of links matches up letter for letter with that in the tutorial slightly concerned as to where I've gone wrong :s

I've been having the same problem, Kharym. Wish I had an answer for both of us. I will be following this discussion with interest. Wishing you the best of luck.

Julian Aramburu
Julian Aramburu
11,368 Points

Hi Kharym! Are you setting that at the top of your css? Because if I recall correctly there is something like a "COLORS" section at the bottom of the css provided in which the body gets a background of #fff which would be white. Always remember that CSS stands for Cascading Style Sheets, and if you add some property:value at some point of your code and then after that you add the same propery:value for the same element again ...it would be override your previous style (that's why it's called cascading style) unless you set it to not do that. Hope you find this answer useful!

Kharym Rasool
Kharym Rasool
1,453 Points

Julian! Yeah the top line of code -

body { background-color: orange; }

is at the top of the main.css file

I have followed what you've said & found that within the normalize.css file the following code exists -

mark { background: #ff0; color: #000; }

should I edit these to my own specifications or leave as is and over write them below,

thanks for your response !

Julian Aramburu
Julian Aramburu
11,368 Points

And inside your main.css file, you don't happen to have again another set of rules defining the body background color?

Kharym Rasool
Kharym Rasool
1,453 Points

sorry let me re-phrase that, there is only 1 line or statement in the main.css file, and that is for the background color to be orange, and the normalize.css file has its own code regarding background color

Julian Aramburu
Julian Aramburu
11,368 Points

Are you using your own main.css file? Because the provided in the course iirc has a body {background-color: #fff} somewhere around the bottom of it. Are your others styles working properly? You could also fork your project for us to see and check what's happening! If you snapshot your workspace just paste it in here :)!

Kharym Rasool
Kharym Rasool
1,453 Points

I created the main.css file yeah therefore that file has only the line of code I've written. All other styles are working fine, although the font did not change for the text on the webpage & I read that this was because the instructions to do so are outdated. I will try to fork the project! thanks for the help so far

Kharym Rasool
Kharym Rasool
1,453 Points

JULIAN! I have solved the problem haha, my folder was titled CSS whereas in my code it was css, not caps lock, what a rookie error! thanks for your time, I appreciate that allot, have a good day!

jamesscott
jamesscott
4,432 Points

Kharym!

You just solved every problem I've been having!

I also had the Folder named CSS instead of css. I would have never guessed that could create such a problem.

Thanks for letting us know about your discovery!!!

-jS