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

Certain pages of my site not showing up properly on mobile device

I have certain pages on my site, www.stlcuresarcoma.org, which don't show up properly on my mobile device. You will notice the homepage is mobile friendly, the navigation is a centered vertical list, but other pages (Volunteer and Sponsorship for example) do not. I have this included on each page, <meta name="viewport" content="width=device-width, initial-scale=1">

Is there a reason this code is only taking effect on certain pages?

Thanks in advance!

Jon

4 Answers

Looking at your responsive.css file I notice that the media query " @media screen and (min-width: 660px) " does not have a closing brace.

I am not supper familiar with how picky safari is, but this could be your problem.

**EDIT

You should also consider running you code through a validator ( http://jigsaw.w3.org/css-validator/#validate_by_input ) to find other errors.

I have just look at your site on my phone and all the pages display the navigation the same way, as a vertical list.

What device and browser are you using?

Thanks for the reply Erik Krieg. I'm using an iPhone 5 and Safari.

Thanks again! It looks fine on Safari when I shrink the screen on my Mac. Not sure what's going on but I'll take another look at it later.