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

Chaz Mabry
Chaz Mabry
7,839 Points

Using Display in CSS Erases Image

When I select the profile photo and add display: block; the image disappears in preview. adding max-width, margin, and border-radius works fine, but as soon as I add display the image does not show in preview. I've also tried other display options besides block and it still erases image. any suggestions?

Ron McCranie
Ron McCranie
7,837 Points

Please post your css because the width or height may not affect the image until you're putting the display to block. So it might not be the block but the block is enabling something else.

1 Answer

Hi Chaz,

If you're using firefox then the image is probably just off the top right of your screen and you might have a horizontal scrollbar where you can scroll to the right and see it.

The problem is due to the floated header. The teacher's notes for the video has a fix for this.

I recommend that you clear the floated header in your wrapper div instead since this is the first element that comes after your header. It should be the one that clears the floated header.

#wrapper {
  clear: both; /* Add this declaration */
  max-width: 940px;
  margin: 0 auto;
  padding: 0 5%;
}

Let us know if it was something else.