Get Even More Visitors To Your Blog, Upgrade To A Business Listing >>

iPad always assuming portrait-width as max-width

iPad always assuming portrait-width as max-width

Problem

I am building an reponsive-website, having 3 sizes. Max 480px, max 768px and max 1024px+; However, I have a problem when using the Ipad. On a Galaxy Tab 10.1 it works like a charm, in my browser it works also good.. but it seems that whenever I use the iPad it always seems think the max-width is 768px.

This is what I mean:

This is my code:




Insert title here
Some color

Although my requirements do not include iPad support, I do want to support it.

Problem courtesy of: Paul Peelen

Solution

This has probably to do with max-scale, min-scale and initial-scale - try setting all of these to 1 and see if anything changes.

The downside is that iOS users won't be able to pinch to zoom in your page.

When you rotate the iPad it doesn't change the viewport, rather it scales the content. There is a good explanation from Allen Pike.

Solution courtesy of: Torsten Walter

Discussion

View additional discussion.



This post first appeared on CSS3 Recipes - The Solution To All Your Style Problems, please read the originial post: here

Share the post

iPad always assuming portrait-width as max-width

×

Subscribe to Css3 Recipes - The Solution To All Your Style Problems

Get updates delivered right to your inbox!

Thank you for your subscription

×