Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

CSS CSS Basics (2014) The Box Model Margins

Why is the footer centered?


I can't help but notice that the footer is also centered after adding "margin: auto" to the primary-content and secondary-content class rule.

How does the footer get affected if the footer is in a class all of its own?

Is it because it has this code? .primary-content, .main-header, .main-footer { text-align: center;

Although, wouldn't it still be pushed to the side of the web page?

Try taking .main-footer out of that line of code and on a line by itself, if you don't want it centered.

2 Answers

Matthew Stanley
Matthew Stanley
1,071 Points

It was already centered before. The element takes up the entire width of the page. When the text is centered, it's also centered on the page, since the footer spans the page. Change the background color, and you'll notice the width of the footer element.

Nick Yoho
Nick Yoho
6,957 Points

Is your footer wrapped inside another tag in your html?