Padding Shortcuts in Css

The same shortcuts used for margin values are also available for padding.
/* Basic container */
#container {
padding: 20px 1em 0 10%;
}
As with the margin property, order is top (20px), right (1em), bottom (0), and right (10px).
Likewise, if all four values are the same, the padding declaration can also be shortened like so:
/* Basic container */
#container {
padding: 20px;
}

Css Tutorial : Margin Shortcuts

A couple of easy shortcuts are available to reduce up to four margin:value declarations into one.
/* Basic container */
#container {
margin: 20px auto 1em auto;
}
The order of the values is very important here. The order is top (20px), right (auto), bottom
(1em), and right (auto). It helps to get used to the order by thinking of it like a compass—north,
east, south, and west, the first value always being north, or like a clock—12 o’clock, 3 o’clock,
6 o’clock, and 9 o’clock, the first value being 12 o’clock.
If all four values are the same, the declaration can be shortened even further:
/* Basic container */
#container {
margin: 20px;
}
These shortcuts will also work for padding and some other properties, which you’ll find out
more about later.