Ustaw szerokość natywnych html5 daty i czasu na urządzeniach z systemem iOS

Używam rodzimej daty i godziny zbierania z typem = data i typ = czas dla mobilnej wersji witryny, nad którą pracuję. Pola wejściowe nie są jednak zgodne z css, które mam.

Pulpit:

urządzenia z systemem iOS:

Zasadniczo potrzebuję dwóch wejść daty i czasu, aby wypełnić ~ 50% szerokości. To jest html i css, którego używam:

<div class="arriveWrapper">
            <div class="arriveDateWrapper fieldWrapper">
                <input class="arriveDate" name="arriveDate" type="date" placeholder="What date?" />
            </div>
            <div class="arriveTimeWrapper fieldWrapper">
                <input class="arriveTime" name="arriveTime" type="time" placeholder="What time?" />
            </div>
            <div class="clear"></div>
        </div>


.arriveDateWrapper {
    width: 49%;
    margin-right: 2%;
    float: left;
    position: relative;
}

        .arriveDate {
            width: 100%;
            height: 28px;
            -moz-box-sizing: border-box;
            -webkit-box-sizing: border-box;
            box-sizing: border-box;
        }

.arriveTimeWrapper {
    width: 49%;
    float: left;
}

    .arriveTime {
        width: 100%;
        height: 28px;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
    }

Jeśli ktoś może mi powiedzieć, jak zdobyć zastępcy, aby pokazać się przy użyciu rodzimych zbieraczy daty / czasu, które byłyby również świetne.

Dzięki!

questionAnswers(2)

yourAnswerToTheQuestion