Responsive/Viewport in Browsern arbeiten, aber nicht in IOS

Ich denke, ich verliere meine Meinung.Responsive/Viewport in Browsern arbeiten, aber nicht in IOS

Ich habe eine Website (die temporäre URL ist http://dev.designersnorthwest.com, ich werde diese URL schließlich entfernen, da es eine Test-Website ist und abläuft), dass die Medienabfragen und reagierende Verhalten gerade in Chrome, Firefox und Safari funktioniert , und testet gut auf meinem Android-Handy, aber aus irgendeinem Grund, dass ich nicht herausfinden kann, wird es nicht auf mehreren iPhones und einem iPad funktionieren, das ich getestet habe.

Um Ihre erste Frage, mein Ansichtsfenster zu antworten auf jeden Fall gibt es ...

<meta name="viewport" content="width=device-width, initial-scale=1.0">

... und ich habe sogar versucht, in jeder CSS-Version setzen konnte ich nicht das Problem, um sicherzustellen, das ist.

@-wekbit-viewport{width:device-width;zoom:1;} 
@-ms-viewport{width:device-width;zoom:1;} 
@-o-viewport{width:device-width;zoom:1;} 
@viewport{width:device-width;zoom:1;}

Noch keine Würfel. Ich habe meine Medienabfragen validiert und der Code sieht gut aus. Ich bin hier ratlos. Irgendwelche Vorschläge würden sehr geschätzt werden.

Quelle

2016-06-10 Talk Nerdy To Me

Es sieht aus wie auf iOS-Geräten, ist Ihre Website einen zusätzlichen Darstellungs Meta-Tages in die <head> Injektion:

<meta name="viewport" content="width=1100">

Das ist, was ich auf meinem iPhone6 Simulator sah, und es ist wahrscheinlich überschreibt Ihren ersten Ansichtsfenster-Meta-Tag . Ich nehme an, Sie haben ein WordPress-Plugin, das zu schlau ist und dieses zusätzliche Tag nur für iOS-Geräte einfügt. Ich würde den ersten Schritt empfehlen, Ihre Plugins zu auditieren, alles abzuschalten, was der Übeltäter sein könnte, und zu bestätigen, dass das Tag mit free Xcode iOS simulator und debugging with Safari verschwunden ist.

Viel Glück!

Quelle

2016-06-10 15:44:10

Danke für Ihre Antwort. Ich habe ein paar Fragen, wenn es Ihnen nichts ausmacht: 1) Ich suche gerade im Xcode iPhone Simulator - wie kann ich "mit Safari debuggen?" Ich sehe mir das "Debug" -Menü an und sehe nichts, was mir helfen könnte. 2) Aus Neugier, welches Tool hast du benutzt, um dieses zusätzliche Ansichtsfenster zu entdecken? –

Folgen Sie den Anweisungen im letzten Link meiner Antwort. Sobald der Web Inspector in Ihrem iPhone Simulator aktiviert ist (unter "Einstellungen"> "Erweitert"), können Sie Safari auf Ihrem Desktop öffnen und zu Entwickeln> iPhone Simulator gehen und die Website, die Sie auf die Website geladen haben, überprüfen Simulator. Ich habe das getan und nur den Quellcode durchgesehen, bis ich entdeckte, dass die Meta-Tags auf iOS anders waren. –

Okay, ich verstehe. Ich habe es vorher noch nie gemacht, also dachte ich nicht, Safari auf meinem Desktop zu öffnen, um etwas in einem komplett anderen Programm zu sehen. Ich bin neu in Xcode. Danke für Ihre Hilfe. –

Responsive/Viewport in Browsern arbeiten, aber nicht in IOS

Antwort

Verwandte Themen