date fields displayed incorrectly on iPhone

Question

On the Accommodation tab of this page, there are a couple of date fields that use this datepicker. Everything works fine on a desktop browser, but when the page is viewed on an iPhone the dates are shown below the fields:

Incidentally, I tried upgrading from the current (deprecated) datepicker to this newer version, but it didn't work out.

Answer 1

I looked a little through the code and I found out that a declaration in one of the css included is what's causing the problem. You seem to merge all your style so I don't know exactly in which one is it (datepicker.css ?), anyway, the declaration

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

Is what's causing the problem. I don't know exactly the purpose of that in the grand scheme, but just deleting the declaration, or changing the display type from inline-block to block, makes everything all right.

Try to investigate starting from there,avoiding to break the style for other browsers already working, and understand the meaning of those inline-block, since they're present in both .datepicker:beforeand .datepicker:after