Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

CSS

Sofronea Gabriel
Sofronea Gabriel
1,396 Points

Portfolio about contact

https://w.trhou.se/ubsv7nb9xa

Portfolio about and contact are not visible when i resize from small to bigger

3 Answers

Diego Vogel
Diego Vogel
9,678 Points

Hey Gabriel,

There are a couple things going on here.

  1. The index.html code needs a meta tag added in the head in order to accurately measure viewport width. One thing they don't explain very well in the videos is that screen resolution is not exactly the same as viewport width. Physical pixels are not the same as CSS pixels. More info here: http://www.howdesign.com/featured/hardware-css-pixels-retina-display/ This is the code you need:

<meta name="viewport" content="width=device-width, initial-scale=1">

  1. The nav links are disappearing when the screen goes from small to big because the nav link text color is the same as the header color. In the media query for 660px screen width the nav background color is set to none, so it looks like the nav links disappear.

I've added these changes to your code and you can see it here: https://w.trhou.se/bhng1ios5v

Hope that helps!

Sofronea Gabriel
Sofronea Gabriel
1,396 Points

Diego Vogel thank you soo much !!!

I have put in the meta code but it does not work

Still disappears in full screen ...

Diego Vogel
Diego Vogel
9,678 Points

Hey Gabriel,

It looks like the nav menu is disappearing because it's the same color as the header. If you change the nav text color you'll see it. Here's one way to fix it: In responsive.css, under the second media query (the one for min-width 660px), add this code: nav a { color: white; }

That will change the nav text color to white for large screens, and you should see the menu.

Sofronea Gabriel
Sofronea Gabriel
1,396 Points

Diego bro have a great day !! :D