W3cubDocs

/CSS

::-moz-placeholder

Non-standard
This feature is non-standard and is not on a standards track. Do not use it on production sites facing the Web: it will not work for every user. There may also be large incompatibilities between implementations and the behavior may change in the future.

Note: The ::-moz-placeholder pseudo-element was introduced as a replacement for the :-moz-placeholder pseudo-class that has been deprecated in Firefox 19. Since Firefox 51 this feature is implemented as the standard ::placeholder pseudo-element.

The ::-moz-placeholder pseudo-element represents any form element displaying placeholder text. This allows web developers and theme designers to customize the appearance of placeholder text, which is a light grey color by default. This may not work well if you've changed the background color of your form fields to be a similar color, for example, so you can use this pseudo-element to change the placeholder text color.

Example

This example styles the placeholder text by making it green.

HTML content

<input id="test" placeholder="Placeholder text!">

CSS content

input::-moz-placeholder {
  color: green;
}

The result looks like this:

Specifications

Not part of any specification.

Browser compatibility

Feature	Chrome	Firefox (Gecko)	Internet Explorer	Opera	Safari (WebKit)
Basic support	?	19.0 (19.0)^[1]	?	?	?

Feature	Android	Firefox Mobile (Gecko)	Firefox OS	IE Phone	Opera Mobile	Safari Mobile
Basic support	?	19.0 (19.0)^[1]	?	?	?	?

[1] Firefox applies a default style of opacity: 0.54 to placeholder text. See bug 556145. Most other major browsers don't currently share this particular default style for their placeholder text pseudo-elements or pseudo-classes.