Cannot combine selectors with commas in CSS

HTML5 placeholders always seem a little taller than the input center, so I'm trying to use CSS, for example ::-webkit-input-placeholder, to drop them a bit. For some reason, I cannot combine the selectors. Here the fiddle demonstrates this: http://jsfiddle.net/n7VV7/

I don't want to separate them, because I use a CSS compression tool that automatically concatenates strings. Right now, I can manually separate them, but in the future I will forget that I cannot combine these lines.

+4
source share
2 answers

You cannot use commas to combine selectors with a provider prefix, because when the browser encounters a selector, it does not understand, this line is "thrown away." That is why it is necessary to break the provider prefixes for any selector, and not just pseudo-classes ::.

Here is a link to CSS-Tricks comment on the problem.

+5
source

It seems that they cannot be combined in one selector, because selectors input-placeholderare used only individually and are described in the standard.

There is a similar question: Why can't provider-specific pseudo-elements / classes be combined in one set of rules?

+1
source

Source: https://habr.com/ru/post/1527384/


All Articles