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
chrissean
Front End Web Development Techdegree Student 6,380 PointsFor some reason my footer will not change to color green.
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Chris Anzures | Designer</title> <link rel="stylesheet" href="css/normalize.css"> <style> footer { color: green; } </style> </head> <body> <header> <a href="index.html"> <h1>Chris Anzures</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> <img src="img/numbers-01.jpg" alt=""> </li> <li> <img src="img/numbers-02.jpg" alt=""> </li> <li> <img src="img/numbers-06.jpg" alt="">
</ul>
</section>
<footer>
<a href = "http://facebook.com">Visit Our Facebook Page
<img src="img/facebook-wrap.png" alt="facebook"/></a>
<a href = "http://twitter.com">Visit My Twitter Page
<img src="img/twitter-wrap.png" alt="twitter"/></a>
<p>© 2016 Chris Anzures.</p>
</footer>
</body> </html>
7 Answers
James Romanowski
6,163 PointsIf you're trying to change the background of the footer you should be using background-color: green or background: green
chrissean
Front End Web Development Techdegree Student 6,380 Points<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Chris Anzures | Designer</title> <link rel="stylesheet" href="css/normalize.css"> <style> footer { color: green; } footer { color: orange; } </style> </head> <body> <header> <a href="index.html"> <h1>Chris Anzures</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> <img src="img/numbers-01.jpg" alt=""> </li> <li> <img src="img/numbers-02.jpg" alt=""> </li> <li> <img src="img/numbers-06.jpg" alt="">
</ul>
</section>
<footer>
<a href = "http://facebook.com">Visit Our Facebook Page
<img src="img/facebook-wrap.png" alt="facebook"/></a>
<a href = "http://twitter.com">Visit My Twitter Page
<img src="img/twitter-wrap.png" alt="twitter"/></a>
<p>© 2016 Chris Anzures.</p>
</footer>
</body> </html
I apologize, it looks like it did not paste everything. I have posted the updated html. I believe I closed the final list item?
James Romanowski
6,163 Points<meta charset="utf-8">
<title>Chris Anzures | Designer</title>
<link rel="stylesheet" href="css/normalize.css">
<style>
footer {
background-color: green;
}
footer {
color: orange;
}
</style>
<header>
<a href="index.html">
<h1>Chris Anzures</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>
<img src="img/numbers-01.jpg" alt="">
</li>
<li>
<img src="img/numbers-02.jpg" alt="">
</li>
<li>
<img src="img/numbers-06.jpg" alt="">
</li>
</ul>
</section>
<footer>
<a href = "http://facebook.com">Visit Our Facebook Page
<img src="img/facebook-wrap.png" alt="facebook"/></a>
<a href = "http://twitter.com">Visit My Twitter Page
<img src="img/twitter-wrap.png" alt="twitter"/></a>
<p>© 2016 Chris Anzures.</p>
</footer>
It should like something like this.
James Romanowski
6,163 PointsSo as of right now the text in the footer should be showing up as green, correct?
chrissean
Front End Web Development Techdegree Student 6,380 PointsYessir it should be showing green.
alastair cooper
30,617 PointsIt is still not closed. The last list item in the <section>
chrissean
Front End Web Development Techdegree Student 6,380 PointsTy for everyone's help! For some reason it wont copy and past everything. I apologize about that. I'll copy and paste the last few lines to below:
<footer>
<a href = "http://facebook.com">Visit Our Facebook Page
<img src="img/facebook-wrap.png" alt="facebook"/></a>
<a href = "http://twitter.com">Visit My Twitter Page
<img src="img/twitter-wrap.png" alt="twitter"/></a>
<p>© 2016 Chris Anzures.</p>
</footer>
</body> </html>
Austin Whipple
29,725 PointsThe color declaration changes the text within an element to that color. If you want to change the background color, you'll need to set background or background-color.
In addition, the color property can be overridden by color declarations on child elements. If you have an anchor tag within your footer, there's a good chance those links will be blue instead of green. You'll need to set the color on footer a in order to override the default anchor text color.
alastair cooper
30,617 PointsIt does not recognise it because you have not closed the final list item.
Your browser thinks the footer is part of that list element.