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 trialRobert Shaw
1,567 PointsIn Use ID Selectors, I can not get my background color to change to Orange using the style sheet.
I can't get index.html to recognize the main.css style sheet when set background to Orange. Help would be appreicated.
Here is the main.css:
body { background-color: orange; }
and the index.html
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Robert Shaw | Designer</title> <link rel="stylesheet" href="css/normalize.css"> <link rel="stylesheet" href="css/main.css"> </head> <body> <header> <a href="index.html"> <h1>Robert Shaw</h1> <h2>Designer</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="imag/numbers-01.jpg"> <img src="img/numbers-01.jpg" alt=""> <p>Experimentation with color and texture.</p> </a> </li> <li> <a href="img/numbers-02.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 an 80's syle of glows.</p> </a> </li> <li> <a href="img/numbers-09.jpg"> <img src="img/numbers-09.jpg" alt=""> <p>Drips created using Photoshop brushes.</p> </a> </li> <li> <a href="imag/numbers-12.jpg"> <img src="img/numbers-12.jpg" alt=""> <p>Creating shapes using repetitione.</p> </a> </li> </ul> </section> <footer> <a href="http://twitter.com/nickrp"><img src="imp/twitter-wrap.png" alt="Twitter Logo"></a> <a href="http://facebook.com/nickpettit"><img src="imp/facebook-wrap.png" alt="Facebook Logo"></a> <p>© 2014 Robert Shaw.</p> </footer> </body> </html>
12 Answers
Charles Gray
19,470 Pointsyour index.html is in the main folder as well? along with your img folder? if it is check your spelling and make sure all your css code is contained with open and closing curly braces {}
Robert Shaw
1,567 PointsThank you. It was the case sensitivity. I had css folder name in all caps and referenced it in lower case in the index.html. Didn't realize it was case sensitive. Going back and checking spelling made me realize that. Newbie mistake, I guess. Thank you for your help.
ronanmcguire
4,497 PointsI had this issue as well. For me it was case sensitivity, which I wasn't aware of. Good to know for the future!
Adam Tatusko
16,589 PointsPlease repost the code in your index.html file using the Markdown Cheatsheet example for posting HTML code.
Email campaigns friends word of mouth referals Personal blog Facebook
31 PointsI am having the same problem, I cant seem to figure it out.
Charles Gray
19,470 Points<a href="imag/numbers-01.jpg">? do you have two img folders? makes sure both of you css files are in the css folder. All your folders should be in the same location otherwise you have to back in and out of the correct folders.
Robert Shaw
1,567 PointsThank you. I had a code typo in two lines with "imag". I fixed those, but same result. I also checked and I only have one img folder in workspace. Both css files are in the css folder. They both disappear when I collapse the folder, so appear to be in there.
Charles Gray
19,470 Points<link rel="stylesheet" href="css/main.css"> try adding <link rel="stylesheet" type="text/css" href="css/main.css">
Email campaigns friends word of mouth referals Personal blog Facebook
31 PointsWhat do you mean by adding?
Charles Gray
19,470 Pointssounds like your css files are contained in another file
Charles Gray
19,470 Pointsit should be main folder (in your main folder should be an index.html file, a img folder and a css folder with css files inside that folder)
Charles Gray
19,470 Pointscss/style.css means css is in it's own folder within the main folder
Robert Shaw
1,567 PointsI have main folder and a css folder with main.css and normalize.css in it and then an img folder with files and the index.html file under the main folder.
Charles Gray
19,470 Pointsok, that sounds right, make sure you drag the css fold into the main folder
Robert Shaw
1,567 PointsThank you. I dragged in back into the main to make sure. Appears to be under main. Still no change.
Charles Gray
19,470 Pointsadd try using.. body { background: orange; }
Robert Shaw
1,567 PointsRobert Shaw
1,567 Pointsindex.html file
main.css