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 How to Make a Website Adding Pages to a Website Style New Pages

Posted by Michael Meave
Michael Meave
469 Points

Picture fell out

Inn the "Style New Pages" part of the track I'm in and placed the following code in the "main.css" file

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

and when I refreshed my port site my profile picture fell out.

2 Answers

Joshua Watson
Joshua Watson
17,373 Points
Joshua Watson
Joshua Watson
17,373 Points

make sure to double check that you have the image on the about.html with the class of profile-photo. You might need to change the border-radius percentage so that the picture doesnt create a full circle and appear to be gone. I use pixels when dealing with border-radius.

Michael Meave
Michael Meave
469 Points

i did that. it ended up being a bug in the program. it was noted in the teachers notes and how to fix it. Thanks for the help.

Alexandra Silcox
Alexandra Silcox
24,486 Points
Alexandra Silcox
Alexandra Silcox
24,486 Points

Also be sure to check your teacher's notes below the video. There's a bug with Firefox that causes the profile picture to not display correctly. This could be your issue. The suggested correction is to use the clear property with a value of both. So the style for your profile photo should look like this. 

.profile-photo {
  clear: both;
  display: block;
  max-width: 150px;
  margin: 0 auto 30px;
  border-radius: 100%;
}

I hope this helps!

Michael Meave
Michael Meave
469 Points

yeah, it did. I saw it waiting for responses to my question. Thanks for the help.