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 Customizing Colors and Fonts Use Color in CSS

Posted by Gregory Frayre
.a{fill-rule:evenodd;}techdegree
Gregory Frayre
Front End Web Development Techdegree Student 2,678 Points

Header highlighted red in css

header { background:6ab47b;

background-color:599a68; }

The header is highlighted in red, can you let me know what the issue might be please.

Conrad Turuk
Conrad Turuk
5,144 Points
Conrad Turuk
Conrad Turuk
5,144 Points

could you paste both your html and css code in full? the colors you listed are two different shades of green so I'm thinking you have a css selector that has a higher authority or you have some other css code that is cascading over your header rules.

2 Answers

Ted Dunn
Ted Dunn
43,783 Points
Ted Dunn
Ted Dunn
43,783 Points

You appear to have two areas where your code differs from what is in the video:

First, you have not included the '#' symbol in front of your hex color values. Second, you have used the property background-color instead of border-color used in the video.

Gregory Frayre
seal-mask
.a{fill-rule:evenodd;}techdegree
Gregory Frayre
Front End Web Development Techdegree Student 2,678 Points
Gregory Frayre
.a{fill-rule:evenodd;}techdegree
Gregory Frayre
Front End Web Development Techdegree Student 2,678 Points

Here is my code.

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Greg F | Developer</title> <link rel="stylesheet" href="css/normalize.css"> <link rel="stylesheet" href="css/main.css"> </head> <body> <header> <a href="index.html" id="logo"> <h1>Greg Frayre</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> <div id="wrapper"> <section> <ul> <li> <a href="img1/numbers-01.jpg"> <img src="img1/numbers-01.jpg" alt=""> <p>Image one</p> </a> </li> <li> <a href="img1/numbers-02.jpg"> <img src="img1/numbers-02.jpg" alt=""> <p>Image two</p> </a> </li> <li> <a href="img1/numbers-06.jpg"> <img src="img1/numbers-06.jpg" alt=""> <p>Image six</p> </a> </li> <li> <a href="img1/numbers-09.jpg"> <img src="img1/numbers-09.jpg" alt=""> <p>Image nine</p> </a> </li> <li> <a href="img1/numbers-12.jpg"> <img src="img1/numbers-12.jpg" alt=""> <p>Image twelve</p> </a> </li> </ul> </section> <footer> <img src="img1/twitter-wrap.png" alt="twitter logo"> <a href="http://facebook.com/gregfrayre"><img src="img1/facebook-wrap.png" alt="Facebook logo"> </a> <p>©2017 Greg F.</p> </footer> </div> </body> </html>

CSS: a { text-decoration:none
}

wrapper{

max-width: 940px;
margin: 0 auto;
padding: 0 5%;

}

logo {

text-align:center; margin: 0; }

a { color:#6ab47b; {

header { background:#6ab47b; border-color:#599a68; }