I knew this existed, just didn’t know exactly how it works. Now I’ll remember. Because I wrote it. Here.
If there is only one value, it applies to all sides. If there are two values, the top and bottom margins are set to the first value and the right and left margins are set to the second. If there are three values, the top is set to the first value, the left and right are set to the second, and the bottom is set to the third. If there are four values, they apply to the top, right, bottom, and left, respectively.
Shorthanding the Shorthanded:
So where you usually have
margin: 6px 12px 6px 12px
You could actually just have
margin: 6px 12px
And in those odd cases where you have
margin: 6px 12px 25px 12px
You could actually just have
margin: 6px 12px 25px
And of course, you could always just have
margin: 6px
Here’s how I’ll remember this: If you see a pattern duplicated, eliminate the duplicate. 6px 12px 6px 12px becomes just 6px 12px.