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

Posted by KP Cluff
KP Cluff
2,344 Points

About page off centered

/**********************
PAGE: ABOUT
***********************/
.profile-photo {
  display: block;
  max-width: 150px;
  margin: 0 auto 30px;
  border-radius: 100%;
}

I am not sure what is wrong my about page is to the right and there is no margin. Help please.

Jonathan Rawlins
Jonathan Rawlins
13,998 Points

Could you show the HTML and CSS around this please? I will try and help you figure this out. Part of me is wondering why you are using max-width? More details would certainly help.

3 Answers

Herb Bresnan
Herb Bresnan
10,658 Points
Herb Bresnan
Herb Bresnan
10,658 Points

I agree with Jonathan. It may be in your HTML. You should have 3 .css files with this project. Make sure they are listed in the proper order in HTML. "css/normalize.css" should be first, then "css/main/.css", followed by "css/responsive.css". If this is the case, remember how the cascade works.

Tom Mertz
Tom Mertz
15,254 Points
Tom Mertz
Tom Mertz
15,254 Points

I had trouble using the margin shorthand like that sometimes. Try being more explicit and using

.container {
  margin-left: auto;
  margin-right: auto;
}

Also, make sure your container that holds everything is the one with the profile-photo class.

Patrick Hilder
PLUS
Patrick Hilder
Courses Plus Student 5,136 Points
Patrick Hilder
Patrick Hilder
Courses Plus Student 5,136 Points

you may want to check that the class in your html is spelled right and is in the right element. as far as i can see the css is right.