CSS shorthand syntax

Feed

Css shorthand

CSS shorthand is used to convert syntax such as

margin-top: 5px; margin-right: 10px; margin-bottom: 5px; margin-left: 10px;

To a more concise syntax consisting of the values in the positions top, right, bottom left.

margin: 5px 10px 5px 10px;

We can even shorten this syntax to the order of top, bottom and left, right

margin: 5px 10px;

Once we have a deeper understanding of CSS, we should start using the shorthand version at all times. Saving space in CSS files should be a priority and the CSS shorthand versions accommodate this.

Next time your confused, remember the rule; top, right, bottom, left, which is the same as a clock face.