Code: Margin shorthand property

From Chapter 7: CSS Optimization

The margin shorthand property sets the margin for all four sides of a box using one, two, three, or four widths in one abbreviated property. margin takes the place of the margin-top, margin-right, margin-bottom, and marginleft properties. The syntax of the margin shorthand property is as follows:

margin: {1,4} | inherit

or:

margin:  top right bottom left

where the margin-width value can be a length (px, em, etc.), a percentage, or auto. Here is a minimal example:

div { margin: 1em; }

This CSS rule sets the margin around all divs to 1 em space. You can set all sides of a box to one width and zero out the widths of one or more sides like this:

div { margin: 1em; }
    div { margin-bottom: 0; }

The padding shorthand property works exactly like the margin shorthand property discussed earlier.