Css For Styling Html5 Date Input Calendar In Chrome

Is there a way to style the calendar that pops up if you click the down arrow on a html5 date input?

Due date &l

Solution 1:

According to Google's FAQ, there is no way to modify the style at this time: https://developers.google.com/web/updates/2012/08/Quick-FAQs-on-input-type-date-in-Google-Chrome

How do I change the appearance of the date picker?

You cannot currently style the appearance of the date picker. In WebKit, we have previously provided ways to style form controls with the -webkit-appearance CSS property or the ::-webkit-foo pseudo class selector. However the calendar popup does not provide such ways in WebKit because it is separate from the document, like a popup menu for , and there is not currently a standard for how to control styling on its sub-elements.

You are left with keeping with Chrome's rendering, or using a custom library over an input type="text" field to prevent conflicts