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

CSS

Posted by Richard McKee
Richard McKee
2,670 Points

why does my footer not center

Html:

   <footer>
       <a href="http://twitter.com/nickrp"> <img src="img/twitter-wrap.png" alt="Twitter-logo" class:"social-icon"></a>
       <a href="http://facebook.com/nickpettit"> <img src="img/facebook-wrap.png" alt="Facebook-logo" class:"social-icon"></a>
        <p>&copy; 2014 Richard McKee.</p>
      </footer>

css

footer {
  font-size:0.75em
  font-align:center;
  clear:both;
  padding-top:50px;
  color:#ccc;
}

.social-icon {
  width:20px;
  height:20px;
  margin 0 5px;
}

any help would be greatly appreciated!

subha thanasekaran
subha thanasekaran
30 Points

that is not font-align, actually its text-align:center;

add css like this:

footer { color: #ccc; float: none; margin: 0 auto; padding-top: 50px; text-align: center; }

Richard McKee
Richard McKee
2,670 Points

Thanks!

Richard McKee
Richard McKee
2,670 Points

Thanks!

5 Answers

mtch
mtch
8,521 Points

If you want to center something, the correct CSS property is:

text-align: center;

What you might want to try in order to center something is:

margin: 0 auto;

Chris Shaw
Chris Shaw
26,676 Points
Chris Shaw
Chris Shaw
26,676 Points

Hi Richard,

The property font-align isn't a valid CSS property, instead what you want is text-align.

Happy coding!

Kelly von Borstel
Kelly von Borstel
28,880 Points
Kelly von Borstel
Kelly von Borstel
28,880 Points

You also forgot the semicolon after font-size:0.75em

Jeremy Woodbridge
Jeremy Woodbridge
25,278 Points
Jeremy Woodbridge
Jeremy Woodbridge
25,278 Points

Hey Richard, I played with the code and made some corrections. Make note of the differences and see how it works

footer { font-size: 0.75em; text-align: center; clear: both; padding-top: 50px; margin: auto; color: #ccc; }

Quick Note: From your original CSS you forgot to add the semi-colon after font-size and font-align is not a real property but text-align is. Lastly margin: auto will automatically balance the margin values of the footer on each side. Give it a shot and comment if anything goes wring. Happy coding -Jeremy

Richard McKee
Richard McKee
2,670 Points
Richard McKee
Richard McKee
2,670 Points

Quick thanks for helping everyone from a simple syntax error! I really should go over my coding more and figure out what the problem is.