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
Michael Godard
5,399 PointsChanging display value to block on .profile-photo makes the picture disappear.
When I change the .profile-photo display value to block, the photo disappears. If I keep it inline, the photo reappears, but isn't centered. Does anyone know why my photo would disappear from changing the display value to block?
Michael Godard
5,399 PointsHere is the CSS rule for .profile-photo
.profile-photo {
clear: left;
display: block;
max-width: 150px;
margin: 20 auto 30px;
border-radius: 100%;
}
I've added the clear: left; declaration, as someone suggested. That makes the image appear, but it isn't centered like in Nick's video. Am I missing something?
***EDIT: I see that I forgot to specify pixel on the first value of the margin. i've fixed it and 'auto' for right/left now centers it. Thanks everyone! Adding clear: left; to the CSS rule made the image appear. *I am using Firefox
3 Answers
Albert Evangelista
27,689 Pointsthis happened to me too while I was using the firefox browser. what I did to fix it was I cleared the left of the photo in the css. clear: left
Michael Godard
5,399 PointsThanks, Albert. That made the image come up. I just added the declaration clear: left; to the .profile-photo {} rule. However, it isn't centered like in Nick's example. How do I center the image in the page using CSS?
Gregory Serfaty
37,140 PointsAre you try to changing the display to inline-block ?
Michael Godard
5,399 PointsThanks Gregory. I did try changing the display to inline-block and that too made the image come up. I was just wondering why it doesn't work when I use the exact same code as in the video? Thanks, again.
Michael Godard
5,399 PointsThanks Gregory. I did try changing the display to inline-block and that too made the image come up. I was just wondering why it doesn't work when I use the exact same code as in the video? Thanks, again.
Ted Sumner
Courses Plus Student 17,967 PointsI have the exact same problem except clear: left made it come back centered.
Nicholas Olsen
Front End Web Development Techdegree Student 19,342 PointsNicholas Olsen
Front End Web Development Techdegree Student 19,342 PointsCan you copy paste your code for us to see?