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

When I add "display: block;" to my image class, it causes the image to align to the right of my header/nav menu. Why?

When I add the Css: "display: block" to my .profile-photo class it cause the image to appear to the right of the header. When i remove the "display: block" line, it appears below the header but isn't centered on the page.

Any ideas what I'm doing wrong?

2 Answers

You probably need to use a clearfix.

clearfix {
content: "";
display: block;
clear: both;

I'll try that. Thanks.

I figured out that my header had a "float: left" line in the Css. When I commented this out, the image appeared underneath the header where it was supposed to be. I'm not sure how float: left got in there. I don't know whether the instructor had it in his code or not. Anyway, the problem is solved unless I needed that float left in there for something else.