Input type date appearance in Safari on iOS

Question

I\'m trying to use a regular input type date to use on mobile devices. But the width set in the CSS is overruled by Safari (or webkit).

I can add -webkit-appea

Answer 1

I have found that to get 100% width correct as per @Boldizsar answer you need a little CSS calc action to remove the width added by the dropdown arrow on iOS.

-webkit-min-logical-width: calc(100% - 16px);