April 25th, 2013, 05:21 PM
Responsive Site working in Browser not mobile
I have been trying to figure out why my site is displaying correctly on my PC but not on mobile devices. msgh dot org
I edited the CSS so that it would respond to different screen sizes and it looks good to me on my PC. When I go to view it on my Android smartphone though only a couple pages look good, the others are all zoomed out too far and the text is hard to read.
Here is an example of a page that looks good on my smartphone. msgh dot org/our-staff/
Here is a page that does not. msgh dot org/our-school/
I have went over the CSS numerous times and can't seem to find what the problem is. Any help would be greatly appreciated.
April 26th, 2013, 10:40 AM
Mobile devices assume pages aren't set up for them unless you specifically tell them otherwise. You do that by adding a special meta tag next to your other meta tags near the top of the page.
<meta name="viewport" content="width=device-width, initial-scale=1.0" />