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 trialMichael Snyder
1,232 PointsMy photo it was not centered as in the video. Then when I add the display: block; my photo is gone.
When i added my photo to about.html i noticed that it was not centered as in the video. Then when i added the display: block; element to main.css the photo is not on the page. Once i remove that style in the CSS file the photo is back left justified.
4 Answers
Colin Marshall
32,861 PointsOk guys I found the solution to this FireFox problem. Nick actually has it in the Teacher's Notes under the video. Here are Nick's notes:
Correction for Firefox
There's a bug in the CSS for this video that causes the profile picture to display incorrectly in Firefox. In order to correct the issue, the clear property with the value both needs to be applied to the .profile-photo class. Here's what the corrected code looks like:
.profile-photo {
clear: both;
display: block;
max-width: 150px;
margin: 0 auto 30px;
border-radius: 100%;
}
Colin Marshall
32,861 PointsI just forked your workspace and previewed the about page. Everything looks normal to me and your photo is centered.
Michael Snyder
1,232 PointsMust be a Fire Fox thing. I just opened with IE and everything looks fine. Thanks for looking at it for me.
Colin Marshall
32,861 PointsYou're probably correct. I used Chrome to look at it.
Koltin Hall
1,184 PointsI'm having issues with this as well picture disappears when using firefox with the "display: block;" like added to the profile-photo class in my css. If someone has an answer to this lemme know. Thanks
John Snow
923 PointsSeems to be a problem with Firefox. I'm having the same issue, when I add the display: block; property the picture is gone. Firefox justifies the picture to the left. Try using a different browser :)
Valdas Stasevicius
432 PointsI am having the same issue with Firefox and display:block, as Firefox refuses to show the picture. Once the line removed, the image is justified to left. First lines of html/css and the first compatibility issue:)
Valdas Stasevicius
432 PointsValdas Stasevicius
432 PointsCheers Colin, it worked for me.
Francis Serpa
4,949 PointsFrancis Serpa
4,949 PointsI was having the same problem. Thanks for the help!
Colin Marshall
32,861 PointsColin Marshall
32,861 PointsNo problem guys! As a friendly reminder, make sure to check the teacher's notes and question tabs under each video. I found the solution by googling the problem, and one of the results was actually a thread on this forum from 9 months ago that said to check Nick's notes for the FireFox fix. I should not have even needed to use google. Lesson learned, haha.
Samuel Benson
2,496 PointsSamuel Benson
2,496 Pointscheers Colin, looking for teachers notes from now on.. (didn't even know there were any!)