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

CSS How to Make a Website Adding Pages to a Website Style New Pages

SAMUEL LAWRENCE
PLUS
SAMUEL LAWRENCE
Courses Plus Student 8,447 Points
Posted by SAMUEL LAWRENCE
SAMUEL LAWRENCE
Courses Plus Student 8,447 Points

Photo display block; Not showing on page.

Hi it's me again. I'm having a small issue with this particular video lesson. I'm following along and my code is identical to Nick's but when I set the ".profile-photo" rule to "display: block;" the photo disappears from the about page. I know it's this line of code because when I comment out this line the photo reappears, only, it's not centered. I also tried using the "text-align: center" rule as he suggested since by default it's set to "inline-block" but that still isn't working, the photo shows but doesn't align center.

I also downloaded the project files and they image isn't showing there either. However in the video it shows.

Julian Gutierrez
Julian Gutierrez
19,201 Points
Julian Gutierrez
Julian Gutierrez
19,201 Points

What browser are you using? I remember having trouble with my results as well. If I remember correctly the image would not show on Firefox but would work in Chrome.

SAMUEL LAWRENCE
SAMUEL LAWRENCE
Courses Plus Student 8,447 Points
SAMUEL LAWRENCE
SAMUEL LAWRENCE
Courses Plus Student 8,447 Points

Hi Julian Gutierrez, thanks for the reply. I was actually just about to post that I realized it was a browser problem. I tried it in Safari after I posted in the forum and it worked fine. The thing is some of the codes work on some browsers and don't on others. For example earlier in the course I was having caching problems with Firefox, when I switched over to Chrome it worked, then further down in the course I was having display problems on Chrome switched back to Firefox it worked, now arose a new problem and it's working on Safari. Does anyone know why this is happening and is this happening to anyone else? I've moved from using the workspace to using Coda. But some issues still arise when viewing the written code in certain browsers.

4 Answers

SAMUEL LAWRENCE
PLUS
SAMUEL LAWRENCE
Courses Plus Student 8,447 Points
SAMUEL LAWRENCE
SAMUEL LAWRENCE
Courses Plus Student 8,447 Points

Yes guys a big THANK YOU. I wasn't sure why cause Pettit didn't mention it during that particular lesson. But what is strange though is that it displayed correctly on the video he recorded and further more as I mentioned in the first reply, it worked fine on the Safari browser without writing in the ** clear: both;** line of code. Anyway guys still a HUGE THANK YOU. This forum is really very helpful and got really quick replies. I'm able to stay current. That's cool!

Jason Anello
Jason Anello
Courses Plus Student 94,610 Points

It seems to be a firefox only problem and Nick was using chrome in the video I think. So that's why the problem wasn't showing up in the video. It was only discovered later after recording that there was a firefox problem.

Jason Anello
PLUS
Jason Anello
Courses Plus Student 94,610 Points
Jason Anello
Jason Anello
Courses Plus Student 94,610 Points

Hi Samuel,

As far as this profile photo problem goes, it's related to the floated header not being cleared.

You should have your wrapper div clear the floated header by adding clear: both;

#wrapper {
  clear: both;
  max-width: 940px;
  margin: 0 auto;
  padding: 0 5%;
}
SAMUEL LAWRENCE
PLUS
SAMUEL LAWRENCE
Courses Plus Student 8,447 Points
SAMUEL LAWRENCE
SAMUEL LAWRENCE
Courses Plus Student 8,447 Points

Hi Julian Gutierrez, thanks for the reply. I was actually just about to post that I realized it was a browser problem. I tried it in Safari after I posted in the forum and it worked fine. The thing is some of the codes work on some browsers and don't on others. For example earlier in the course I was having caching problems with Firefox, when I switched over to Chrome it worked, then further down in the course I was having display problems on Chrome switched back to Firefox it worked, now arose a new problem and it's working on Safari. Does anyone know why this is happening and is this happening to anyone else? I've moved from using the workspace to using Coda. But some issues still arise when viewing the written code in certain browsers.

Emily Hamilton
Emily Hamilton
537 Points
Emily Hamilton
Emily Hamilton
537 Points

This isn't so much an answer as it is a BIG FAT THANK YOU to Samuel for asking this question and to Jason and Julian for answering it. I was having the same issue and it had me seriously scratching my head.