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 Center the Wrapper

zakariya shishani
PLUS
zakariya shishani
Courses Plus Student 1,355 Points

background-color is not orange

my background-color is not changing to orange. this is my code in main css a { text-decoration: none;

}

wrapper {

max-width: 940px; margin: 0 auto; background-color: orange; } and html

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>zakariya | Designer</title> <link rel="stylesheet" href="css/normalize.css"> <link rel="stylesheet" href="css/main.css">

</head> <body> <header> <div id="wrapper"> <a href="index.html"> <h1>zakariya</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="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-02.jpg"> <img src="img/numbers-02.jpg" alt=""> <p>experimentation with color and texture</p> </a> </li> <li> <a href="img/numbers-06.jpg"> <img src="img/numbers-06.jpg" alt=""> <p>experimentation with color and texture</p> </a> </li> <li> <a href="img/numbers-09.jpg"> <img src="img/numbers-09.jpg" alt=""> <p>experimentation with color and texture</p> </a> </li> <li> <a href="img/numbers-12.jpg"> <img src="img/numbers-12.jpg" alt=""> <p>experimentation with color and texture</p> </a> </li>

</ul>   

</section> <footer> <a href="http://twitter.com/Shishani"><img src="img/twitter-wrap.png" alt="twitter logo"></a> <a href="http://facebook.com/OmranShishani"><img src="img/facebook-wrap.png" alt="facebook logo"></a> <p>Ā© 2016 zakariya.</p> </footer> </div>

</body>

</html>

zakariya shishani
zakariya shishani
Courses Plus Student 1,355 Points

by the way i did copy and paste the code but it is missing some of the code!!!!!!

2 Answers

Nicolas Fernandez
seal-mask
.a{fill-rule:evenodd;}techdegree
Nicolas Fernandez
Full Stack JavaScript Techdegree Student 17,565 Points

you defined wrapper as a ID, to select a ID in css you have to type ( # ) first.

Result:

#wrapper { max-width: 940px; margin: 0 auto; background-color: orange; }

zakariya shishani
zakariya shishani
Courses Plus Student 1,355 Points

Dear Nicolas..... thanks for your fast response, as i said when i made copy and paste for my code the # was missing, but in the actual code it is there and when i save my work and push preview my name portfolio about and contact becomes orange but not the jpgs. here is my code again: a { text-decoration: none;

}

wrapper {

max-width: 940px; margin: 0 auto; padding: 0 5%; background-color: orange; }

zakariya shishani
zakariya shishani
Courses Plus Student 1,355 Points

by the way i just noticed when i post my ? the # disappears but when i push edit ? i still see it

Nicolas Fernandez
seal-mask
.a{fill-rule:evenodd;}techdegree
Nicolas Fernandez
Full Stack JavaScript Techdegree Student 17,565 Points

I tried and the code is working for me, maybe try to put this code in the head section: link rel="stylesheet" href="css/main.css" type="text/css"

zakariya shishani
zakariya shishani
Courses Plus Student 1,355 Points

I found the problem, thanks for your help. I put the div after opening " header " while it should be after closing "header"