Do you have a question? Post it now! No Registration Necessary. Now with pictures!
- Thomas 'PointedEars' Lahn
July 3, 2014, 8:38 am
rate this thread
Andrew Poulos wrote in <news:comp.infosystems.www.authoring.stylesheets>:
Maybe the best solution is neither HTTP, nor CSS or scripting. I thought
that it would suffice to set “max-width” or “width” CSS properties, and I
found older recommendations for @viewport rules on the Web.
But what really worked for me is this “meta” element I found when I emulated
“HTC Sensation, Evo 3D” (since I own an HTC Sensation) in Chromium 34 on
<https://twitter.com/ , which redirected me to <http://mobile.twitter.com/ :
<meta name="viewport" id="viewport" content="width=device-width, initial-
scale=1.0, maximum-scale=1.0, user-scalable=0">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
appears to be working fine for the language selection on my Web site,
<http://PointedEars.de/ . (I still have to do something about the background
when content is zoomed, though.)
It would appear that non-mobile browsers ignore this element, so you can
always include it, and you may not need an extra mobile version in simple
cases like this.
(It did not work so well for “Home” because it prevented the horizontally
arranged "links", that I put there particularly for mobile “Features”, from
being accessible. And fixed widths like “540px”, unstead of “device-width”,
prevent the zoom in the built-in Android browser. So I am not using it
there for the time being. Also, setting the viewport width this way may
trigger @media queries for the screen unintentionally; that happened to me
Please do not play stupid.
When all you know is jQuery, every problem looks $(olvable).