Mobile Viewport Orientations initial-scale=1.0

http://sinfronteras.edu.mx/p7/fine5.htm
(+ see 2 screenshots attached)
responsive website design testing on iPad portrait & landscape orientations with viewport width=device-width
portrait version shows perfectly what one would expect for 768px
landscape version (1024px) shows a mimic of the narrow portrait version and ignores the media query
effectively blowing up the content and disregarding the extra available horizontal space
is this really a default iOS behaviour? or an iOS bug?
most android tablets act perfectly well for both orientations
initial-scale=1.0 has been suggested by some but highly frowned upon by others
can we come to an agreement about this for the sake of our common mental health?

 

The people who have 'issues' with initial-scale usually don't know enough about designing for mobile to be running their yaps on the subject. Every page I design now includes the following in the markup:

<meta
	name="viewport"
	content="width=device-width; height=device-height; initial-scale=1.0"
/>

Code (markup):

I had to add device-height since some android devices when rotated ignore width

with this in my CSS:

@media (max-width:600px) {
	* {
		-webkit-text-size-adjust:none;
		-ms-text-size-adjust:none;
	}
}

Code (markup):

It's in a media query since sending this to desktop Safari prevents zoom controls from working -- herpaderp since mobile safari has no such issues!

The reason we have to do this is simple -- mobile browsers don't actually expect websites to be designed for mobile, so they dick with the default font sizes and widths, lie about their widths and so forth. Using these is basically telling them "We know what we're doing, so don't screw around ignoring or overriding our settings"

If you're gonna design for mobile, with elastic semi-fluid responsive design like we're ALL supposed to be doing, you will need to use the above values. Anyone who "frowns" upon that can do us all a favor and take a nice big helping of sierra tango foxtrot uniform. Basically anyone running their mouth that way doesn't know enough about the subject to be flapping their gums about it!

Of course designing with dropdown menus and script-tard bullshit isn't exactly 'mobile friendly' either.

 

thanks for the reply

are dropdown menus really not mobile friendly? i dont mind them myself. what would the alternatives be for large menus?