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

Popular posts from this blog

javascript - RequestAnimationFrame not working when exiting fullscreen switching space on Safari -

Python ctypes access violation with const pointer arguments -