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

Problems with display: block; in stylesheet for about.html

For some reason when I attempt to style the profile photo on the about page with display: block; it makes the photo disappear. All of the other declarations of the rule function fine in its absence. Ideas?

4 Answers

Nicole H
Nicole H
2,981 Points

Hi Jesse,

I am not sure what the issue might be, but my first suggestion would be to make sure you aren't missing any semicolons that would separate the declarations and that you aren't missing any opening or closing tags in your html. Leaving any of the above out can cause some weird things to happen. If that doesn't work, could you post the css so that we can troubleshoot it?

Thanks for replying Nicole. So far as I can tell, all the tags syntax looks good. Still disappears when the display declaration is included in the rule. Here's the corresponding css and html:

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

<img src="img/nick.jpg" alt="Photograph of Nick Pettit" class="profile-photo">

Thanks again!

Edit to update: I just figured it out. It's a bug in firefox. All it took was an additional declaration of clear: both;

Nicole H
Nicole H
2,981 Points

Great! Glad you were able to get it figured out!

Bradley Maravalli
Bradley Maravalli
8,927 Points

I had the same issue you did. The additional declaration of... clear: both; ...did the trick for me.

Note: I am running out of Safari.

Thanks, that saved me a lot of frustration!