Combined CSS selectors dont work?

Question

This works:

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

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

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

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

But this does nothing, at least on Chrome:

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

Why is this the case?

Answer 1

See the warning in the spec:

A comma-separated list of selectors represents the union of all elements selected by each of the individual selectors in the list.

Warning: the equivalence is true in this example because all the selectors are valid selectors. If just one of these selectors were invalid, the entire group of selectors would be invalid.

Then, the group of selectors doesn't work because each browser only accept its vendor prefix, but the other ones are invalid.