IPad ne réduit pas correctement la taille du site web en mode portrait

Question

Ceci est un peu inhabituel et je me demandais si quelqu'un avait une solution.

Nous construisons actuellement quelques sites Web qui ont une largeur de plus de 1000px et pour une raison quelconque, lorsque l'iPad les charge en mode portrait, il les redimensionne mais laisse une certaine largeur sur la droite, de sorte que vous devez faire défiler un peu pour tout voir.

J'ai ajouté ce qui corrige le problème mais lorsque chargé en mode paysage, l'utilisateur se retrouve avec un petit site au départ et peut zoomer trop loin.

Un exemple de ceci peut être vu sur l'un de mes sites de développement personnel. Ce n'est pas encore en ligne donc veuillez ignorer les bugs http://www.dundeewebstandards.com/events/

Merci,

Chris

Answer 1

J'avais le même problème et j'ai essayé toutes les solutions proposées que j'ai pu trouver, en vain. Finalement, j'ai compris... Si la hauteur de votre page est inférieure à 1024px et que la largeur est supérieure à 768px, la fonctionnalité de zoom native ne fonctionne pas comme prévu. C'est également vrai si la largeur de votre page est supérieure à sa hauteur. Essayez d'utiliser une requête media query pour ajouter une min-height à votre page. Voici le code que j'ai utilisé pour résoudre ce problème...

#page-container{
    width: 1200px;
    margin: 0 auto;
}
@media screen and (min-width: 768px) {
    #page-container{
        min-height: 1240px;
    }
}