Atributo de marcador de posição CSS de estilo, da maneira certa

Já há algum tempo, os navegadores modernos permitem que você defina o estilo dos valores do atributo placeholder de uma entrada usando as propriedades prefixadas, como:

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

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

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

Tudo bem e elegante. O que você NÃO quer fazer é o que a maioria das pessoas (eu incluído) sempre faz no início, que é seguir o princípio DRY e agrupar essas propriedades completamente:

input:-moz-placeholder,
input
::-webkit-input-placeholder,
input
:-ms-input-placeholder {
color
: green;
}

Isso não funcionará, uma vez que os navegadores são instruídos a ignorar uma regra de estilo inteira se uma das propriedades for desconhecida. Obviamente, -webkit não tem idéia do que é -moz, e vice-versa … então você terá que se repetir, por enquanto.

Um exemplo: http://jsbin.com/ihiwed/3/edit