CSS Pseudo-element ::placeholder

Creates

A pseudo-element with the placeholder-text of the selected element.

Examples

This selector allows us to style the placeholder of a form element. The placeholder is set with the placeholder attribute. At the moment we need browser prefixes for this pseudo-element. Hopefully this will change soon.

Examples

::-webkit-input-placeholder {
   color: gray;
}

::-ms-input-placeholder {  
   color: gray;
}

::-moz-placeholder { /* For Firefox 18- */
   color: gray;
}

::-moz-placeholder {  /* For Firefox 19+ */
   color: gray;
}

Compatibility

Chrome	Firefox	Internet Explorer	Opera	Safari
4+	4+	10+	11.6+	5+