bug iOS 9 - regole css ignorate - Biblioteca eccellente

Dall'aggiornamento a iOS 9, la mia applicazione Web ha cambiato comportamento e ora mostra tutti i contenuti con stile css display: none e visibility: hidden. Questa "funzione" è visibile in Safari e Chrome per iOS. Lo stesso contenuto è nascosto (come previsto) in Chrome, Firefox, Safari e IE per Windows e telefoni Android. Il problema sembra correlato a iOS ma non sono riuscito a trovare alcuna informazione a riguardo.bug iOS 9 - regole css ignorate

So che c'è un bug di media query per iOS 9 (descritto here e here) ma non ho problemi con la reattività della pagina né lo zoom.

Vale anche la pena notare che sto usando Twitter Bootstrap 3 ed è in particolare le loro classi nascoste che non funzionano correttamente in iOS.

<div class="hidden">Hide me please</div>

Perché il contenuto non si nasconde?

Aggiornamento

Ho fatto un fiddle per il test. Contiene due oggetti nascosti, ma in questa versione semplificata solo uno di essi fallisce. Mi aspettavo che entrambi fallissero come nel mio scenario reale, ma non riesci a ottenere tutto ciò che desideri;)

fonte

2015-11-03 Nurp

puoi creare un violino o aggiungere uno snippet di codice che riprodurrà il problema che hai ?? – wf4

@ wf4 sicuro, l'ho aggiunto alla domanda – Nurp

'hidden-xs' significa che sarà nascosto solo su dispositivi di piccole dimensioni (<768px), sei sicuro che il dispositivo che stai provando abbia una larghezza inferiore a 768px? Forse hai bisogno di 'hidden-md' perché sia nascosto sul tuo dispositivo? Non ho iOS9 per testare la mia teoria, ma potresti testarlo. Se ciò non funziona, ci sono [molte altre classi Nascondi/Mostra disponibili] (http://getbootstrap.com/css/#responsive-utilities-classes) – turbopipp

Suppongo che sia correlato alla larghezza del bug spesso riportato su IOS9 che potrebbe sembrare che Safari non stia prendendo nel giusto account il media-query.

Una possibile soluzione potrebbe essere, il fissaggio o l'aggiunta di quei valori nella meta viewport:

initial-scale=1.0001 
minimum-scale=1.0001 
maximum-scale=1.0001 
user-scalable=no

Non impostare la larghezza della pagina nella meta-finestra! Questo causerà solo più problemi.

tutto sommato in questo modo:

<meta name="viewport" content="initial-scale=1.0001, minimum-scale=1.0001, maximum-scale=1.0001, user-scalable=no"/>

se funziona, è possibile impostare un javascript solo per aggiungere una specifica meta viewport per IOS9 solo WebKit.

fonte

2015-11-11 00:35:11 holden

Questo risolve l'errore con le query multimediali, ma non l'errore con cui sto combattendo: / – Nurp

bug iOS 9 - regole css ignorate

risposta

Problemi correlati