How do I simulate placeholder functionality on input date field?

Question

It's impossible to use placeholder on date fields but I really need it.

I want two date inputs with texts "From" and "To" on each one as placeholders.

Answer 1

I'm using the following CSS only trick:

  input[type="date"]:before {      content: attr(placeholder) !important;      color: #aaa;      margin-right: 0.5em;    }    input[type="date"]:focus:before,    input[type="date"]:valid:before {      content: "";    }

<input type="date" placeholder="Choose a Date" />