0

I'm very sorry that I'm bothering you with this, but I couldn't find any answers to this search query on Google.

So let me explain my problem really quick. I've created a webpage that changes between portrait- and landscape mode.

When I use desktop it's perfectly fine, the page displays correctly. When I launch my webpage on my IPhone 5 it does something "weird": it only partionally displays the page. If I want to see the entire page I need to zoom out, which is quite annoying for users.

So if you guys know how to resolve this problem, please tell me!

Thank you so much for helping me out!

EDIT: I am using the <meta name="viewport" content="width=device-width, initial-scale=1.0"> tag

For optimizing the css for mobile devices, I used the media query

@media screen and (orientation:portrait) {...}

ANSWER:

This is the cause of my issue: Reset zoom level onload. Sadly, it's not yet possible to fix this problem... This is the case because I have a login form on a previous page that links to a new page whenever I log in. With IOS your browser automatically zooms in at the input, which when the new page is loaded, still is the zoom level...

wq nu
  • 23
  • 6
  • We're going to see more of your code to help with this. Off the bat, it sounds like you may not be using the right viewport meta in the element, and you probably need to write a media query or two in your CSS file. – Jesse Aug 27 '17 at 14:59
  • sometimes if there is content that overflows the it causes problems. Please provide your code, and a screenshot (or a url) for better debugging – Yonatan Aug 27 '17 at 15:04
  • If my answer helped you, would you please accept it? I know you don't have enough reputation to upvote yet. – Robert Moore Aug 27 '17 at 15:06
  • The problem is that I'm not allowed to provide alot of code, so if you can tell me what to specifically provide I'll try to do it! The screenshots will be coming ASAP – wq nu Aug 27 '17 at 15:07
  • Also, see this, which may be a duplicate of your question: https://stackoverflow.com/questions/14272420/webpage-starts-zoomed-in-on-mobile-devices – Robert Moore Aug 27 '17 at 15:14

2 Answers2

0

Using <meta name="viewport" content="width=300"> should make your webpage automatically zoom all the way out for almost all mobile devices. But make sure that your site is mobile-optimized, otherwise all of your text will become tiny and people will wish that they had zoomed in again.

Robert Moore
  • 2,207
  • 4
  • 22
  • 41
0

This is the cause of my issue: Reset zoom level onload Sadly, it's not yet possible to fix this problem...

This is the case because I have a login form on a previous page that links to a new page whenever I log in. With IOS your browser automatically zooms in at the input, which when the new page is loaded, still is the zoom level...

wq nu
  • 23
  • 6