Responsive web design css media queries and Iphone of different resolutions
I am using media queries in my application and it seems to work well and display well at http://www.responsinator.com/ , but when I view a real iPhone 4 my webpage is not readable at all. It looks all enlarged.
Trying to figure out the actual reason, it seems that the respondent is showing the iPhone 4 resolution as 320 x 480, whereas this website http://www.iphoneresolution.com/ shows it as 640 × 960. My iPhone looks like 640 × 960. Like me should handle these cases in CSS media queries?
+3
Jack
source
to share
1 answer
Add view meta tag to head
-area of your html files:
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
This code makes your website look right.
+6
kleinfreund
source
to share