iOS safari messes up input type=date

This fixes all my date fields on IOS.

input[type="date"]
{
    display:block;
    -webkit-appearance: textfield;
    -moz-appearance: textfield;
    min-height: 1.2em;
}

This is the way iOS treats input type="date". I wouldn't worry about native styling. It may look off, but people using iOS are used to it.

You can use min-width:95% on the date input. It makes it fit, at least in iOS 8, and doesn't change the appearance otherwise. Though I haven't tested in Android or earlier version of iOS. Alternatively, to just center it, you can add .center-block to the input, so at least it's center and doesn't look so off.

DEMO: http://jsbin.com/civor/1/

.input-min-width-95p {min-width:95%;}

HTML:

<input type="date" class="form-control input-min-width-95p" ...