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

kevinardo
seal-mask
.a{fill-rule:evenodd;}techdegree
kevinardo
Treehouse Project Reviewer
Posted by kevinardo
.a{fill-rule:evenodd;}techdegree
kevinardo
Treehouse Project Reviewer

How to make a website.

There is a problem with the profile photo in the firefox browser. It's somehow related to setting display:block, it just doesn't want to show up,. As soon as you remove the property it appears again, but as a result it cannot be centered.

When adding float:left in the min-width: 480px media querie it appears again but still dont want to show up when you resize below 480...

I tried with the final project files (Nick's portfolio) and it's the same result... I'm using the latest Firefox (27.01).

Thanks for a great course Nick and i hope we can solve this issue :)

Casey M
Casey M
2,495 Points
Casey M
Casey M
2,495 Points

I have the same/a similar problem. Didn't see your question before I posted mine. If you scroll left (as opposed to resizing the window) is your picture showing up next to the navigation? This is driving me nuts!

6 Answers

Lori Brandimarte
Lori Brandimarte
10,848 Points
Lori Brandimarte
Lori Brandimarte
10,848 Points

I am having the same issue. I check the link to Casey's post but neither of the suggestions worked. The only thing that works is to remove the display: block; line but that makes the image appear clear over on the left of the page. With the display: block; line there the page renders it as if there is nothing there.

Jacob Miller
Jacob Miller
12,466 Points
Jacob Miller
Jacob Miller
12,466 Points

Did you remove the float: left on the header? Make sure the header is a block element also.

Lori Brandimarte
Lori Brandimarte
10,848 Points
Lori Brandimarte
Lori Brandimarte
10,848 Points

Ah ha! I made the header a block element and ta da!

Thanks Jacob =)

kevinardo
seal-mask
.a{fill-rule:evenodd;}techdegree
kevinardo
Treehouse Project Reviewer
kevinardo
.a{fill-rule:evenodd;}techdegree
kevinardo
Treehouse Project Reviewer

Thanks alot Jacob Miller! I took your solution and changed it to include a class to the section .and gave it clear:both to clear the float from the headinghtml <section class="about>content about me</section> and gave the about class a `css clear:both property! Now it works just fine in Firefox and my pic is centered on mobile :) , thx again,

Jacob Miller
Jacob Miller
12,466 Points
Jacob Miller
Jacob Miller
12,466 Points

Cool! Glad it worked for you guys.