On 1/18/2013 11:00 AM, Rob Emenecker wrote:
Just as a note, you might want to consider a reponsive approach that
is not device-specific. Makes it easier to test ;-)
Thanks Al! I was going for device width's rather than viewport sizing. When
I originally did the size, I had the width's based on viewport and it tested
out okay.
Hi Rob,
No matter what you might hear or read to the contrary, if you want your
site to logically respond to a mobile device's viewport, your page needs
to have this meta tag:
<meta name="viewport" content="width=device-width">
Do not use initial-scale or you will have problems when switching
orientation.
Without the meta tag, your iOS device, and some Android devices, will
attempt to shrink the page - while other Android devices will render in
what is called "Overview" mode. The results are not pretty.
When using the meta tag (looks like you are, albeit with initial scale),
you do not have to declare for device width in your media queries. You
can use:
@media only screen and (min-width: 0px) and (max-width: [xxx]px) {}
The added benefit here is that your page will also be responsive in
traditional devices - and will be far easier for folks on this list to
help you debug :-)
--
Al Sparber - PVII
http://www.projectseven.com
The Finest Dreamweaver Menus | Galleries | Widgets
Since 1998
______________________________________________________________________
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
