Largeur de 100% ne fonctionne pas sur iOS
Pour une certaine raison, et sur l'iphone, mon pied de page ne veut pas s'étendre à travers l'écran, même si c'est du css est mis à width: 100%. Vous pouvez voir un exemple de mon pied de page ici: http://pixelcakecreative.com/tla2/
Mon css pour le pied de page est comme suit:
#footer{ width:100%; margin-top:100px; position:relative; clear:left; background:#4c4c4c; float:left; padding:30px 0;}
Ce problème s'applique UNIQUEMENT aux appareils iOS, comme la mise en page fonctionne parfaitement sur les navigateurs PC. Une idée de comment résoudre ce problème? J'ai essayé tout ce que je peux penser. Merci!
- comme il s'avère, la solution est de changer la fenêtre d'affichage de la largeur de la largeur du site web contenant: <meta name="viewport" content="width=1010" /> cependant, il semble qu'il se charge bien, et puis en une fraction de seconde plus tard, l'iphone échelles vers le bas juste un peu donc il y a une pièce supplémentaire vers la droite. Consultez le site pour voir ce que je veux dire
Vous devez vous connecter pour publier un commentaire.
Essayer en simplifiant votre meta name fenêtre d'affichage (au moins pour iOS) à la ligne suivante:
Les attributs de moins que ce que vous êtes normalement, dit avoir, je sais, mais cela a fonctionné pour mes projets mobiles.
Maintenant, en regardant de plus près, la majorité si votre site est "centre", et puis vous avez l'emballage et le pied de page.
Le code utilisé pour l'emballage et le pied de page est différente. Wrapper est fixe
width:941px;
alors que le pied de page juste awidth:100%
. La majorité des éléments à l'intérieur wrapper ontwidth:100%
mais qui ne fonctionne que parce que wrapper awidth: 941px
.Donc, soit vous essayez d'ajouter que même largeur et de rembourrage pour le pied de page
{width:941px; padding:30px 34px;}
ou quelque chose le long de ces lignes OUVous jetez un pied de page à l'intérieur d'un semblable wrapper avec un fixe, avec, rembourrage, etc et puis laissez laissez-pied de conserver
width:100%;
votre
div#innerFooter
est d'empêcher le pied de page à l'échelle correctement, réglez la largeur à 100% et cela devrait résoudre le problèmeVous êtes probablement manquant mobile de la fenêtre d'affichage de la balise meta
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
C'est nécessaire pour les appareils mobiles comme iOS correctement l'échelle de la page à la fenêtre d'affichage. Vous pouvez lire à ce sujet ici ou ici.
Essayez de laisser initiale de l'échelle et du maximum de l'échelle de vide et de l'utilisation par l'utilisateur de défilement=non. Les deux premières laisser la même erreur dans un projet qui est le nôtre avec le responsive design. Je n'ai pas compris pourquoi encore.