campi data visualizzati in modo errato su iPhone

Question

Nella scheda Alloggio dello this page, ci sono un paio di campi data che utilizzano this datepicker. Tutto funziona bene su un browser desktop, ma quando la pagina viene visualizzata su un iPhone le date di seguito sono riportati i campi:

Per inciso, ho provato l'aggiornamento dalla corrente (deprecato) datepicker a this newer version, ma non ha funzionato.

Answer 1

Prova CSS:

#booking label { width: 100% } 

o qualcosa di simile con il parametro di larghezza o forse:

#booking label { display: block; } 

Answer 2

ho guardato un po 'attraverso il codice e ho scoperto che una dichiarazione in una delle il css incluso è ciò che sta causando il problema. Sembri per unire tutto il vostro stile in modo da non so esattamente in cui uno è esso (datepicker.css?), In ogni caso, la dichiarazione

.datepicker:before{content:''; display:inline-block;} 

è ciò che sta causando il problema. Non conosco esattamente lo scopo di questo nel grande schema, ma semplicemente cancellando la dichiarazione, o cambiando il tipo display da inline-block a block, tutto va bene.

Cercate di indagare a partire da lì, evitando di rompere lo stile per altri browser già lavorando, e capire il significato di quelle inline-block, dato che sono presenti in entrambi .datepicker:before e .datepicker:after

Answer 3

Invece di utilizzare una terza parte datepicker, è possibile dal momento che iOS 5 per utilizzare un datepicker origini:

<input type="date"> 

E 'anche possibile check if the browser supports input type="date". È possibile utilizzare la soluzione nativa del browser, se disponibile, e utilizzare il datapicker di terze parti come fallback.