HTML5 date field and placeholder text in Safari

JavascriptWeb DevelopmentFront End Scripts

The placeholder attribute does not support input elements on the input type date.

However, you may have seen it works on Safari web browser because it is not supporting the date type. That would mean the attribute is ignored and the remaining is only a plain text field.

Therefore, the following works on Safari Desktop −

<input type = "date" name = "dob" id = "dob" value = "" placeholder = "add dob" />
As an alternative for Safari mobile, use:
input[type='date']:after {
   color: #000000;
   content: attr(placeholder);
}

And the HTML −

<input name = "mydate" type = "date" value = "" placeholder = "add dob" />
raja
Published on 06-Apr-2018 17:02:16
Advertisements