Don't use shorthands in CSS
In [[CSS]] we have shorthands which makes it easier to write certain properties, for example
background
or margin
. However, these affect more properties than what you're probably aiming for.Instead use specific properties such as
background-color
or margin-left
/*
Here's an example where we want to change the background color to red.
*/
.test {
background: red;
}
/*
By using background we implicitly set all other values to initial
when we only wanted to change the background color
*/
.test {
background-image: initial;
background-position-x: initial;
background-position-y: initial;
background-size: initial;
background-repeat-x: initial;
background-repeat-y: initial;
background-attachment: initial;
background-origin: initial;
background-clip: initial;
background-color: red;
}
CSS Wizardry. ([[2016-12-12]]). "CSS Shorthand Syntax Considered an Anti-Pattern". Link