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 Responsive Web Design and Testing Adjust the Profile Page and Header

Nathan Brazil
PLUS
Nathan Brazil
Courses Plus Student 2,756 Points
Posted by Nathan Brazil
Nathan Brazil
Courses Plus Student 2,756 Points

Image disappears when resizing image in Firefox only!

When I scale down my window my profile picture disappears, instead of the media query swapping out the bigger picture for a smaller one. This only happens in the latest version of Firefox for Mac.

Niclas Valentiner
Niclas Valentiner
8,947 Points
Niclas Valentiner
Niclas Valentiner
8,947 Points

Hard to help when there's no code to check, and does this only happen in firefox or what?

The question topic isn't very indicative of the problem either.

Brandon Mowat
Brandon Mowat
8,186 Points
Brandon Mowat
Brandon Mowat
8,186 Points

yeah, gonna need to see your code

Niclas Valentiner
Niclas Valentiner
8,947 Points
Niclas Valentiner
Niclas Valentiner
8,947 Points

There's quite a lot of references in the CSS I can't see in the html file so I'm not really sure which parts of it apply to that page.

As a quick note: Where are your head and body tags?

Nathan Brazil
Nathan Brazil
Courses Plus Student 2,756 Points
Nathan Brazil
Nathan Brazil
Courses Plus Student 2,756 Points

This website isn't posting my code properly. When I copy and paste my code it erases my body head and tags like you mentioned, and my css looks like crap, so unless I can give you guys a clear view of my code I will just delete this question. And Niclas I don't appreciate your snobby comments about how I choose to word my question seeing that you only have 4000 points and Im pretty sure you used the word indicative incorrectly.

Niclas Valentiner
Niclas Valentiner
8,947 Points
Niclas Valentiner
Niclas Valentiner
8,947 Points

Only trying to help, not looking to offend or get berated.

If you have such a problem with me, I'll just try to ignore your questions in the future, ok?

Brandon Mowat
Brandon Mowat
8,186 Points
Brandon Mowat
Brandon Mowat
8,186 Points

Maybe make a github site so that we can see it in action for ourselves.

1 Answer

vftwm
vftwm
17,516 Points
vftwm
vftwm
17,516 Points

This seems to be a problem only in Firefox. When viewing http://treehousewebsite.com/about.html in Firefox (38.0.5), the profile-picture disappears and sits out of the viewport, right of the header.

There are several ways I tried which fix this issue in Firefox, but I don't really know why:

  1. give the profile-picture class a clear property of left, right or both. or
  2. give the section which includes the "about me" text a clear property of left, right or both or
  3. Float the section which includes the "about me" text left or right.

Maybe Nick Pettit could help throwing some light on this issue.