It's not recommended to group selectors that are meant to work with different browsers. For example, styling an input's placeholder needs multiple selectors per the browser. If we group the selectors, the entire rule will be invalid, according to w3c.
/* Don't do this, please */
input::-webkit-input-placeholder,
input:-moz-placeholder {
color: #222;
}
Instead, do this.
input::-webkit-input-placeholder {
color: #222;
}
input:-moz-placeholder {
color: #222;
}
- Previous Minimum Content Size In CSS grid
- Next Image maximum width
Support Defensive CSS
Do you like the content? You can buy me a cup of coffee. Thank you!
About the author
Ahmad Shadeed
Ahmad is a UX designer and front-end developer from Palestine. He enjoys working on challenging design and front-end development projects. He wrote a book on debugging CSS, writes extensively on CSS, Accessibility, and RTL (right to left) text styling.