html - Grouping placeholder color styling -
how come works:
input { color: #807e82; } input:-moz-placeholder { color: #807e82; } input::-moz-placeholder { color: #807e82; } input:-ms-input-placeholder { color: #807e82; } input::-webkit-input-placeholder { color: #807e82; }
but doesn't:
input, input:-moz-placeholder, input::-moz-placeholder, input:-ms-input-placeholder, input::-webkit-input-placeholder { color: #807e82; }
seems bit of pain if want change input colors , placeholder colors on quickly.
that's because how css error handling works: if single rule in selector invalid (not recognized user agent, precise), whole selector , rule discarded user agent.
in second example, each browser have own indigestible part of selector (firefox won't know -ms-input...
, chrome , ie - -moz-...
etc). whole rule ignored.
Comments
Post a Comment